vue2父子组件传值,子组件使用$emit传值的种种情况!

1.父组件向子组件传值

思路:

1.在父组件中定义title和obj

2.引入子组件Children,并展示为<Children></Children>

3.在Children标签中使用v-bind定义parentTitle属性和parentObject属性,属性的值分别为title和obj(要传的数据)

4.子组件使用props来接收使用v-bind定义的属性(parentTitle和parentObject),之后就可以使用传过来的数据

父组件代码:

子组件代码:

 2.子组件向父组件传值

1.子组件传递一个参数

思路:

1.父组件:使用@自定义一个事件(本文为parentEvent),并绑定一个函数(本文为receive)用来接收子组件传的值

2.子组件:在一个button中绑定一个点击事件(本文为trigger),点击触发事件后使用$emit触发在父组件中自定义的事件

父组件代码:

子组件代码:

 

 2.子组件传递多个参数

父组件:

 子组件:

 3.子组件传递一个参数,父组件自带一个参数

父组件:

 

 

 子组件:

 


版权声明:本文为qq_45651984原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。