美文网首页
子组件传值给父组件$emit

子组件传值给父组件$emit

作者: 了彧 | 来源:发表于2018-11-20 16:40 被阅读0次

子组件中步骤:

  (1)在data中定义需要传递的值

      data () {

        return {

          childMsg : '子组件传值给父组件的值',

          childBlock : false

        }

      },

  (2)传值方法

      backClick(){

        this.$emit('parentByClick',this.childMsg,this.childBlock);

      }

      parentByClick:父组件中需要绑定的方法名

      this.childMsg,this.childBlock:传递的数据

子组件

  父组件中接收步骤:

  (1)调用子组件import 自己起个名 from '子组件路径'(将子组件引入父组件中)

  (2)注册所调用的子组件

      在components中注册,因为可能有多个子组件,所以家“s”

      components: {

        child //刚刚调用是起的名,要一致,例如为child

      },

  (3)在父组件中引用子组件

      <child @parentByClick="childClick"></child>

  (4)childClick方法接收子组件传递的数据

      childClick(obj,childState){

        this.childMsg = obj;

        this.childBlock = childState;

      }

父组件

相关文章

  • vue2.0小结

    父组件与子组件之间的通信 父组件传值给子组件,通过props 子组件传值给父组件,通过$emit 如果在父组件想在...

  • vue组件通信

    通常父子组件通信都是用props和$emit进行传递,父组件通过props传值给子组件,子组件通过$emit传值给...

  • Vue组件通信,父传子,子传父

    子组件 父组件 效果 总结 子组件接收父组件传值 (props) 子组件传值給父组件($emit())

  • 复习Vue 组件间通信.md

    1. props/$emit 父组件向子组件传值:父组件通过props向下传递数据给子组件 子组件向父组件传值(通...

  • Vue3——组件传值 & v-model & 异步组件 & te

    一、父子组件传值 父组件通过props向子组件传值,子组件通过emit触发自定义事件传递新值给父组件。props:...

  • vue父子组件传值

    一、子组件传值到父组件$emit 1、子组件传入: 2、父组件接收 二、父组件传值到子组件 props1、父组件...

  • vue 组件通信传值

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

  • Vue_组件间传值

    1、父组件传值给子组件2、子组件传值给父组件 1、父组件传值给子组件 2、子组件传值给父组件

  • Vue 组件通信

    父组件通过 props 给子组件传值 子组件通过 vm.$emit(event, arg) 触发父组件事件 其他组...

  • 简单的todo-list

    利用v-model双向数据绑定父组件向子组件传值用 props子组件向父组件传值用 $emit()

网友评论

      本文标题:子组件传值给父组件$emit

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