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

组件 之 父级传子级

时间:2019-01-05 21:28:49      阅读:118      评论:0      收藏:0      [点我收藏+]

标签:template   app   rip   数据传递   col   rop   one   自定义   component   

父级数据传递给子级:
  1.通过在子组件的身上加一个v-bind:自定义属性名=父级的数据
    <ppa v-bind:data="arr"> ->简写 <ppa :data="arr">
  2.子组件通过props去接收
    props:[‘data‘]
  3.使用
    {{data}}
例子:
DOM部份
<div id="app">
        <h1>{{arr}}</h1>
        <hr>
        <ppa :data="arr"></ppa>
</div>
script部份
    let obj = {
        props:[‘data‘],
        template:`
            <ul>
                <li v-for="(val,key) in data">{{val}}</li>
            </ul>
        `
    }

    Vue.component(‘ppa‘,obj);

    new Vue({
        el:‘#app‘,
        data:{
            arr:[1111,2222,3333]
        }
    });

 

组件 之 父级传子级

标签:template   app   rip   数据传递   col   rop   one   自定义   component   

原文地址:https://www.cnblogs.com/MrZhujl/p/10226069.html

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