父子组件的传递

父组件

<template>
  <div>
    parent
    <child :parentHandler="parentHandler" />
  </div>
</template>
<script>
import child from "@/components/child";
export default {
  components: { child },
  data() {
    return {};
  },
  methods: {
    parentHandler() {
      console.log("这是父组件的方法");
    },
  },
};
</script>

子组件

<template>
  <div>
    child
    <button @click="handler">这是子组件的按钮</button>
  </div>
</template>
<script>
export default {
  props: {
    parentHandler: {
      type: Function,
      default: () => {
        return Function;
      },
    },
  },
  methods: {
    handler() {
      this.parentHandler();
    },
  },
};
</script>