一、单向传递
1、父通过参数调用子,单项传递。
在子组件里通过props定义参数,例如props:["para1","para2"],父组件里用:para1="value1" :para2="value2"传递参数。
平台推荐上述用法
2、父通过$refs取得子的数据
父给子起名: ref="child1"
父取值:this.$refs.child1.数据
平台推荐上述用法
父可以直接通过上述方法给子赋值,平台不推荐该方法,这种需求请用1方式解决。
3、子调用父的函数,执行操作,并传递参数。
父将函数名字传给子: @ondo="fun"
子调用父 this.$emit("ondo",参数1,参数2)
平台推荐上述用法
4、子通过$parent.直接调用父方法
this.$parent.fun
平台不推荐该方法
二、双向传递
1、v-model方式
底层录入控件常采用这种方式
子组件在props里定义 "value" 参数
父组件通过 v-model传递传入参数
子组件通过this.$emit("input",值)返回
平台推荐上述用法
2、sync方式
父通过.sync传值,例如:visible.sync
子通过props接收参数
子通过this.$emit("update:参数",值)回传
这种方式本质上是单项传递中1、3的组合,只是简化了编程而已
平台推荐上述用法