组件通信
父子组件
-
prop和event
-
style
和class
父组件可以向子组件传递style
和class
,它们会合并到子组件的根元素中 -
attribute
如果父组件传递了一些属性到子组件,但子组件并没有声明这些属性,则它们称之为attribute
,这些属性会直接附着在子组件的根元素上
不包括
style
和class
,它们会被特殊处理
-
natvie
修饰符
在注册事件时,父组件可以使用native
修饰符,将事件注册到子组件的根元素上 -
$listeners
子组件可以通过$listeners
获取父组件传递过来的所有事件处理函数 -
v-model
-
sync
修饰符
和v-model
的作用类似,用于双向绑定,不同点在于v-model
只能针对一个数据进行双向绑定,而sync
修饰符没有限制 -
$parent
和$children
在组件内部,可以通过$parent
和$children
属性,分别得到当前组件的父组件和子组件实例 -
$slots
和$scopedSlots
-
ref
父组件可以通过ref
获取到子组件的实例
跨组件通信
-
Provide
和Inject
-
router
如果一个组件改变了地址栏,所有监听地址栏的组件都会做出相应反应
最常见的场景就是通过点击router-link
组件改变了地址,router-view
组件就渲染其他内容 -
vuex
适用于大型项目的数据仓库 -
eventbus
组件通知事件总线发生了某件事,事件总线通知其他监听该事件的所有组件运行某个函数