美文网首页
Prop 向子组件传递数据-通过事件向父级组件发送消息

Prop 向子组件传递数据-通过事件向父级组件发送消息

作者: 欢喜明 | 来源:发表于2018-07-29 14:30 被阅读0次

记录:

解释:

1、组件里面的元素'blog-post',通过:v-on:click="incrementTotal",监听点击事件,如果发生点击事件,那么就触发:incrementTotal(事件),而incrementTotal(事件)是本组件定义的一个函数;

2、this.$emit('enlarge-text2'); 表示向父组件触发一个自定义的监听事件:'enlarge-text2',就像上面的系统定义的click事件;

3、v-on:enlarge-text2="env"  : 表示监听enlarge-text2事件,如果被触发了,就执行“env”(自定义的一个函数);

PS:1~3就实现了子组件向父组件通过事件发送消息;就是子组件进行了一些操作(如点击子组件的按钮,然后想告诉父组件要干嘛干嘛);

4、props: ['post'] : 表示,props是关键字,数组里面的每一个值代表组件的一个数据属性,就是一个变量;

5、v-bind:post="post" :表示本组件的post属性获取父组件的post属性(变量)的值,也就是父组件向子组件传递数据了;

相关文章

  • Vue组件间数据的传递

    通过 Prop 向子组件传递数据 通过事件向父组件发送消息

  • 温故而知新之VUE(三)

    组件 通过Props向子组件传递数据 通过事件向父级组件发送消息 通过 this.$emit(fnName, da...

  • vue父子组件交互

    一、父组件向子组件传值 通过 Prop 向子组件传递数据 父组件 子组件接收 单向数据流:父级 prop 的更新会...

  • vue 组件通信传值

    1. 父组件向子组件传值 父组件通过 prop 给子组件下发数据,子组件通过$emit触发事件给父组件发送消息,即...

  • Vue 的组件之间如何通信

    1.父子组件之间的消息传递 父组件向子组件传递数据是通过prop传递的,子组件传递数据给父组件是通过$emit触发...

  • 2018-03-29

    子组件向父组件传递事件 父组件的数据是通过变量传递给子组件,子组件内的prop接受数据;子组件内部发生的事件,子组...

  • Vue父子组件之间的通信

    在Vue中,父子组件的关系可以总结为,父组件通过prop向下传递,给子组件发数据,子组件通过事件给父组件发送消息。...

  • Vue组件间通信

    Vue组件间通信 父子组间通信 通过props向子组件传值,通过事件向父级组件发送消息 通过props向子组件传值...

  • React入门系列(六)组件间通信

    父子组件直接通信,主要靠props实现。 父组件通过props向子组件传递数据和方法 子组件触发事件,通过prop...

  • Prop 向子组件传递数据-通过事件向父级组件发送消息

    记录: 解释: 1、组件里面的元素'blog-post',通过:v-on:click="incrementTota...

网友评论

      本文标题:Prop 向子组件传递数据-通过事件向父级组件发送消息

      本文链接:https://www.haomeiwen.com/subject/owizmftx.html