1、props
作用:让组件接收外部传过来的数据
适用场景:父子组件通信
3种书写方式
1.只接收:props:["name"];
2.限制类型:props:{"name:String"};
3.限制类型,限制必要性,指定默认值:props:{name:{type:string,required:true}}
props配置项详解:vue学习——props配置项详解
2、自定义事件
适用场景:子组件给父组件传递参数
使用 $on(eventName)
绑定事件(在父组件中绑定事件)
使用 $emit(eventName)
触发事件(子组件中触发事件)
自定义事件详解:vue学习——自定义事件详解
3、全局事件总线$bus
适用场景:万能
new Vue({
...
beforeCreate(){
Vue.prototype.$bus=this;
},
...
}).$mount("#app")
全局事件总线$bus详解:vue学习——全局事件总线$bus详解
4、消息订阅与发布(pubsub)
适用场景:万能
消息订阅与发布详解:vue学习——消息订阅与发布pubsub详解
5、插槽
作用:让父组件可以向子组件指定位置插入html结构
适用场景:父子组件通信
3种方式
1.默认插槽
2.具名插槽
3.作用域插槽
slot插槽详解:vue学习——slot插槽详解及案例练习
6、Vuex
定义:在vue中实现集中式状态(数据)管理的一个vue插件,对vue应用中多个组件的共享状态进行集中式的管理
理解:父组件往子组件插入一段html代码
适用场景:万能
vuex详解:vue学习——vuex详解及案例练习