vue父-子-点击事件传递

1、

$emit

2、
父组件

<template>
  <section class="product-entering-list">
    <child
      :options="options"
    ></child>
  </section>
</template>

<script>
import child from "./child"
export default {
  name: 'test',
  components: { child },
  data() {
    return {
      options: [
        {
          txt: '点击我',
          handler: () => {
            this.handleClick()
          }
        }
      ]
    }
  },
  mounted() {
    
  },
  methods: {
    handleClick() {
      console.log('我是父组件');
    }
  }
}
</script>

<style lang="less">

</style>

子组件

<!--
 * @Author: your name
 * @Date: 2020-04-11 10:37:24
 * @LastEditTime: 2020-04-11 10:57:50
 * @LastEditors: your name
 * @Description: In User Settings Edit
 * @FilePath: \longzhu-mdm-web\src\views\kit\productLibrary\productScan\child.vue
 -->
<template>
  <section class="product-entering-list">
    <el-button v-for="(item, index) in options" :key="index" 
      type="primary"
      @click.stop="() => item.handler()"
    >
      {{item.txt}}
    </el-button>
  </section>
</template>

<script>

export default {
  name: 'child',
  components: { },
  props: {
    options: { 
      type: Array,
      default: () => ([])
    },
  },
  data() {
    return {
    }
  },
  mounted() {
    
  },
  methods: {
    handleClick(val) {
      
    }
  }
}
</script>

<style lang="less">

</style>