组件通信

 

 vue组件件数据参数传递

 

父子之间传递

使用props由父级传递给子组件

使用$emit由子级触发父级的回调函数,并传递参数

子孙组件传递

1,简单粗暴使用父子传递套娃,这种粗暴的方式会导致中间的组件多出许多无用的属性以及回调函数

2,使用$attrs与$listeners

    祖 -> 孙   

    在祖组件传递的数据中,中间组件没有使用props注册接收,中间组件可以使用$attrs接收到所有未注册的数据,然后可以使用v-bind=“$attrs”将祖组件的数据传给孙组件

   

    孙 -> 祖

    中间组件可以使用$listener来接收所有来自孙组件的所有回调函数,然后使用v-on=‘$listeners’来获取所有监听函数

    要注意,这里是在中间组件使用$listeners来接收孙组件的所有回调函数,然后祖组件则可以在直接在中间组件上拿到孙组件的回调函数

 

 

没有嫡系关系的组件的数据传递

使用一个vue实例作为事件中心,在这里实现订阅发布,一般放在Vue.prototype.$EventBus,方便全局访问,这个叫EventBus

但现在较多的用vuex

详情内容

posted @ 2021-08-28 16:46  来吃点代码  阅读(81)  评论(0)    收藏  举报