一. 父子之间的通信
1. 父组件-》子组件(props down)
①通过属性
步骤1:父组件在调用子组件时传值
<son myName="michael" myPhone='123'></son> <son :myName="userList[0]"></son>
步骤2:子组件通过props得到父组件的传过来的数据
Vue.component('son',{ props:['myName','myPhone'] })
②通过$parent
直接在子组件中通过this.$parent
得到调用子组件的父组件
2、子组件-》父组件(events up)
①events up
步骤1:在父组件中 调用子组件的时候 绑定一个自定义事件 和 对应的处理函数
methods:{ recvMsg:function(msg){ //msg就是传递来的数据 } }, template:' <son @customEvent="recvMsg"></son> '
步骤2:在子组件中 把要发送的数据通过触发自定义事件传递给父组件
this.$emit('customEvent',123)
② $refs
步骤1:在调用子组件的时候 可以指定ref属性
`<son ref='zhangsan'></son>`
vue父子兄弟之间的组件通信
最新推荐文章于 2022-04-12 14:30:33 发布