vue中子组件接收父组件传递的函数

在Vue.js中，子组件可以接收来自父组件的函数作为props（属性）。这通常用于实现父子组件之间的通信，让父组件能够控制子组件的行为。这种做法称为“回调 props”或者“自定义事件”。

以下是一个简单的例子：

<!-- 父组件 -->
<template>
  <div>
    <child-component :call-me="parentCallback" />
  </div>
</template>

<script>
export default {
  methods: {
    parentCallback(data) {
      // 父组件对传递过来的函数的操作
      console.log('Parent called:', data);
    }
  }
}
</script>

<!-- 子组件 -->
<template>
  <button @click="$emit('call-me', 'Hello from child!')">点击我</button>
</template>

<script>
export default {
  props: {
    callMe: {
      type: Function,
      required: true
    }
  },
  mounted() {
    this.callMe('这是我在子组件中调用的');
  }
}
</script>

当用户点击子组件中的按钮时，它会触发`callMe`方法，并传递一个字符串给父组件。父组件接收到这个函数后，可以在适当的时候调用它。