码迷,mamicode.com
首页 > 其他好文 > 详细

使用-Prop-传递数据(父组件通过 props 向下传递数据给子组件)

时间:2017-07-04 16:38:58      阅读:153      评论:0      收藏:0      [点我收藏+]

标签:app   nbsp   doctype   bind   传递   组件   htm   round   title   

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>使用-Prop-传递数据</title>
    <script src="vue.js"></script>
</head>
<body>
<div id="app">
    <!--传入值到子模板的props-->
    <child my-message="hello!"></child>

    <!--绑定父组件的数据到子模板的props-->
    <child2 v-bind:cm="parentMsg"></child2>
</div>
<script>
    Vue.component(child, {
        props    : [myMessage],
        template : <span>{{ myMessage }}</span>
    })


    Vue.component(child2, {
        props    : [cm],
        template : <span>{{ cm }}</span>
    })

    new Vue({
        el         : #app,
        data : {
            parentMsg : parentMsg
        }        
    })

</script>
</body>
</html>

 

使用-Prop-传递数据(父组件通过 props 向下传递数据给子组件)

标签:app   nbsp   doctype   bind   传递   组件   htm   round   title   

原文地址:http://www.cnblogs.com/adaBlog/p/7117070.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!