vue父组件传子组件函数

在Vue中，父组件可以通过props将一个函数传递给子组件。首先，在父组件中定义一个方法，并将其作为属性传递给子组件。例如，你可以在父组件中定义一个名为handleSomethFun的方法，并将其传递给子组件my-component的handlerSomethFun属性。代码如下所示：

<template>
  <section class="section-container">
    <my-component :handlerSomethFun="handleSomethFun"></my-component>
  </section>
</template>

<script>
import myComponent from './myComponent'

export default {
  name: 'myComponent',
  data() {
    return {}
  },
  methods: {
    handleSomethFun() {
      console.log('我是父组件中的方法')
    }
  }
}
</script>

在子组件中，你可以通过props接收父组件传递过来的函数属性。在子组件的created钩子函数中，你可以调用这个函数。代码如下所示：

props: {
  handlerSomethFun: {
    type: Function,
    default: () => {}
  }
},
created() {
  this.handlerSomethFun()
}

这样，当子组件被创建时，它会调用父组件传递过来的函数。
#### 引用[.reference_title]
- *1* *2* *3* [vue 父组件给子组件传递一个函数](https://blog.csdn.net/qyl_0316/article/details/117331486)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]