vue中子组件向父组件传递参数(通信)

原创 2018年04月17日 18:07:46

vue构建项目时,在组件内部引用了子组件,子组件的数据更新或者状态更新,需要向父级组件传递参数,在传递上如下进行定义:

子组件中,在需要向父级组件传递参数的方法中,使用emit传递参数

this.$emit('loadsuc', true);

父组件中,v-on:loadsuc 来监听和接收参数

<template>
  <div>
    <hometask v-on:loadsuc="loadflag"></hometask>
  </div>
</template>
<script>
  import hometask from '../basis/hometask.vue'
  export default {
    components: {
      hometask
    },
     methods: {
      loadflag(data) {
          // 接收到的参数在data中
         console.log(data)
       }
    },
 }
</script>
采用上述方法,即可完成从子组件向父组件传递参数(通信)。本文结。


vue 子组件向父组件传递参数

vue自定义事件每个vue实例都实现了事件接口,即$on(),$emit() 都是vue实例的方法,所以在vue选项上需要this来指定。 $on() 事件监听-作用与父组件作用域子组件标签上 $e...
  • evendetail
  • evendetail
  • 2017-11-24 11:46:20
  • 138

vue-子组件向父组件传值

子组件注册触发事件,父组件注册 触发子组件事件后的方法写在method里面 父组件这么写 Do you like me? {{childWords}} methods: { ...
  • yu88288356
  • yu88288356
  • 2017-02-06 17:22:38
  • 28495

vue子组件向父组件传值问题

Vue子组件向父组件传递数据: http://blog.csdn.net/yu88288356/article/details/54895033
  • qq_37962545
  • qq_37962545
  • 2017-11-28 13:54:10
  • 189

vue2.0中子组件向父组件传递数据的方法,以完整demo演示

子组件child.vue源码:&amp;lt;template&amp;gt; &amp;lt;div class=&quot;child&quot;&amp;gt; &amp;lt;bu...
  • Fabulous1111
  • Fabulous1111
  • 2018-01-04 20:24:44
  • 202

vue学习(四):子组件向父组件传参

子组件向父组件传参主要依靠 v-on 和  $.emit 这个是vue官网上给的方法调用,我们看看页面上怎么使用。 子组件 main_Header.vue {{coun...
  • u011175079
  • u011175079
  • 2018-01-25 14:22:54
  • 89

前端框架Vue(8)——子父组件的传参通信

父子间的通信传值是 vue 中的一个重要的内容和掌握点。  *vue2.0 推荐使用 vuex,全局进行状态管理。(后面再讲)  首先讲一下遇到的 需求背景: 解释一下:   组件之间的关系: ...
  • DOCALLEN
  • DOCALLEN
  • 2017-04-14 15:26:40
  • 14222

VUE 父组件向子组件传值,子组件向父组件传值

子组件代码 child子组件部分 {{message}} 向父组件传值 export default { props : ["message"], ...
  • yaoyyl
  • yaoyyl
  • 2017-12-03 23:38:21
  • 130

vue-cli 子组件向父组件传递参数,触发父组件方法

  • guohao326
  • guohao326
  • 2017-09-19 10:46:49
  • 1456

vue 父组件与子组件相互通信

父组件传值到子组件注册一个子组件,需要向子组件传值,给渲染的子组件自定义标签属性,绑定传输数据msg是绑定的自定义属性,类似我们原生html 给标签自定义属性一样,Widget是传输变量, 子组件接...
  • github_37847992
  • github_37847992
  • 2017-10-06 21:50:58
  • 802

Vue2.0 子组件传值给父组件

this.$emit(event,...args); /* * event: 要触发的事件 * args: 将要传给父组件的参数 */ Usage: 子组件内容: methods:{ ...
  • u013240543
  • u013240543
  • 2017-03-31 11:25:14
  • 18422
收藏助手
不良信息举报
您举报文章:vue中子组件向父组件传递参数(通信)
举报原因:
原因补充:

(最多只允许输入30个字)