实例 Vue 使用 emits 选项来记录组件通过 $emit() 方法发出的内容

<template>

  <h2>Example $emit() Method</h2>

  <p>Custom events received from child component:</p>

  <p id="pElMsg">{{ message }}</p>

  <child-comp v-on:custom-event="this.message+=' Yes?'" />

</template>

​

<script>

export default {

  data() {

    return {

      message: ' '

    }

  }

}

</script>

​

<style>

#pElMsg {

  background-color: lightgreen;

  padding: 10px;

  margin: 0;

  max-width: 350px;

  display: inline-block;

  font-family: 'Courier New', Courier, monospace;

}

</style>