Vue子向父事件传值：$emit

Posted 2021-07-17 安之ccy

子向父传值，需要在子组件使用$emit注册一个事件A，告诉父组件，此刻我希望你执行这个事件，并传递参数给你
父组件接收子想要执行这个事件的要求，开始处理

子组件注册事件updateTitle：

  methods:{
      changeTitle:function(){
        this.$emit("updateTitle","子向父传值")
      }
  }

父组件接收v-on:updateTitle，接收的参数传递给$event，执行updateTitle函数；将title改成子传过来的数据：

<div id="app">
    <app-header v-bind:title="title" v-on:updateTitle="updateTitle($event)"></app-header>
    <h1>{{title1}}</h1>
    <user v-bind:users="users"></user>
    <user v-bind:users="users"></user>
    <app-footer v-bind:title="title"></app-footer>
  </div>

  methods:{
    updateTitle(title){
      this.title = title
    }
  }