vue3 父组件给子组件传值传一个方法 子组件里面的props用箭头函数怎么写

在Vue3中，可以使用`setup()`函数来定义组件的逻辑，包括通过`props`传递数据和方法。

如果父组件想要向子组件传递一个方法，可以在`setup()`函数中定义一个函数，并将其作为`props`传递给子组件。子组件可以使用`onUpdate`函数来接收该方法并将其保存到本地变量中，以便在需要时调用。

下面是一个简单的示例：

父组件：

<template>
  <child :myMethod="myMethod" />
</template>

<script>
import { defineComponent } from 'vue'

export default defineComponent({
  setup() {
    const myMethod = () => {
      console.log('Hello from parent')
    }

    return {
      myMethod
    }
  }
})
</script>

子组件：

<template>
  <button @click="handleClick">Click me</button>
</template>

<script>
import { defineComponent, onUpdated } from 'vue'

export default defineComponent({
  props: {
    myMethod: {
      type: Function
    }
  },
  setup(props) {
    let localMethod = null

    onUpdated(() => {
      localMethod = props.myMethod
    })

    const handleClick = () => {
      if (localMethod) {
        localMethod()
      }
    }

    return {
      handleClick
    }
  }
})
</script>

在子组件中，使用`props`接收父组件传递的方法，并使用`onUpdated`函数在组件更新后将其保存到本地变量中。然后，在处理点击事件时，检查本地变量是否存在该方法，并调用它。