vue之父子组件之间传值

一。父组件向子组件传值

父组件:vue之父子组件之间传值
这里先引入子组件,然后自定义一个变量,我这里是msg,在data里设置好msg的值。

子组件:
vue之父子组件之间传值
这里子组件用props接收就可以了,也可以定义msg的类型,比如数组,对象等等。注意:props的位置,新手容易写错

结果:
vue之父子组件之间传值

二。子组件向父组件传值

子组件:vue之父子组件之间传值
子传父就用this.$emit(),里边的第一个参数就是父组件那边接收的方法,剩下的就是值了,这里我传了两个值。

父组件:
vue之父子组件之间传值
这个@father的名字要和子组件写的第一个参数一样,至于@father后边的就是父组件的方法了,当接受多个参数时,不要忘记依次把值写在方法的()里。

结果:
vue之父子组件之间传值