<my_cpn :cmovies=“movies” :cmessage=“message”></my_cpn>
- {{movie}}
{{cmovies}}
{{cmessage}}
自定义事件(子传父)
-
props用于父组件向子组件传递数据,还有一种比较常见的事子组件传递数据或事件到父组件中
-
我们需要用自定义事件来完成
-
什么时候需要自定义事件呢?
-
当子组件需要向父组件传递数据时,就要用到自定义事件
-
v-on不仅仅可以用于监听DOM事件,也可以用于组件间的自定义
-
事件自定义事件的流程:
-
在子组件中,通过
$emit()来监听事件
-
在父组件中,通过
v-on来监听子组件事件
-
简单例子:
-
我们之前做过两个按钮+1和-1,点击修改counter
-
我们整个操作的过程还是在子组件中完成,但是之后的展示交给父组件
-
这样,我们就需要将子组件中的counter,传给父组件的某个属性,比如total
<cpn @itemclick=“cpnclick”>
<button v-for=“item in categories” @click=“itemclick(item)”>
{{item.name}}
-