父到子
通过自定义属性 在子组件内部 用props 接收 (单向数据流 props验证)
子到父
<btn :add="add"></btn>
props:["add"]
1 把父组件内的方法 通过自定义属性的方式 传递给子组件, 在子组件内部 用 props 接收 ,
在子组件的内部 通过调用来自于父组件传递过来的方法 从而实现 向父组件 传递或修改 父组件的数据
<btn @add="add"></btn>
emits:["add"] 可写可不写
2 把父组件内的方法 通过自定义事件的方式 传递给子组件,在子组件内部 用 $emit("事件名字",参数1,参数2) 调用来自于父组件传递过来的方法 从而实现 向父组件 传递或修改 父组件的数据
<btn v-model:msg="msg"></btn>
props:["msg"]
emits:["update:msg"] 可写可不写
<btn v-model="msg"></btn>
props:["modelValue"]
emits:["update:modelValue"] 可写可不写
3 在组件标签上 使用 v-model
当v-model 后面 没起名字的时候 默认叫 modelValue 不起名字 只能有 一个
其他
4 本地存储
5 后代传值 Provide / Inject 不光是 父子 , 爷孙也行
6 兄弟组件传值 bus总线 通过创建一个 空的 vue 实例 作为中转 用 $on $emit 这俩方法 实现 (vue2)
7 vuex