一、父组件=》子组件传递数据
1、子组件在props中创建一个属性,用以接收父组件传过来的值
2、父组件中注册子组件
3、在子组件标签中添加子组件props中创建的属性
4、把需要传给子组件的值赋给该属性
二、子组件=》父组件传递数据
*当子组件需要向父组件传递数据时,就要用到自定义事件。
1、子组件中需要以某种方式例如点击事件的方法来触发一个自定义事件
2、将需要传的值作为$emit的第二个参数,该值将作为实参传给响应自定义事件的方法
3、在父组件中注册子组件并在子组件标签上绑定对自定义事件的监听
父子通信可看以下示例
不管是组件还是实例 自己的数据只能自己使用
props 自定义属性 将父亲的数据传给儿子
1.在组件标签上使用自定属性
2.在组件内部通过props来接受自定义属性
3.接受完了 既可以在组件里直接使用 只能用不能改
/
/
子父通信
自定义事件 子组件触发父组件的方法
e
m
i
t
可
以
触
发
绑
定
在
组
件
身
上
自
定
义
事
件
1.
在
组
件
标
签
绑
定
一
个
自
定
义
事
件
<
s
o
n
@
c
u
s
t
o
m
=
′
a
d
d
′
>
<
/
s
o
n
>
2.
在
组
件
的
内
部
通
过
emit 可以触发绑定在组件身上自定义事件 1.在组件标签绑定一个自定义事件 <son @custom='add'></son> 2.在组件的内部 通过
emit可以触发绑定在组件身上自定义事件1.在组件标签绑定一个自定义事件<son@custom=′add′></son>2.在组件的内部通过emit 触发这个自定事件
在子组件里触发父组件的方法
*/
兄弟通信中,做了一个小例子,关于兄弟组件控制对方的显示与隐藏, 并从中了解两者的关系
组件1 和组件2 是兄弟
组件1有div 可以显示隐藏
组件2 有butoon 控制显示隐藏
控制显示隐藏的值放在公有的父组件上
在通信中,组件之间传值,他们都有一个共同点就是有中间介质,
*子向父的介质是自定义事件
*父向子的介质是props中的属性
*非父子组件的介质是中央事件总线
抓准这三点对于组件之间通信就好理解了