关于vue3:vue30父组件调用子组件中的方法

父组件
ParentComponents.vue

<!-- 1. 在子组件上绑定ref -->
<children-component :ref="getChildList"></children-component>
...
<script>
  import { ref } from 'vue'
  export default {
    setup () {
      // 2、父组件中定义和ref同名的变量
      const getChildList = ref(null)
      onMounted (() => {
        // 4、调用子组件中的getList()办法
        console.log(getChildList.value.getList())
      })
      return {
        // 3、return进来
        getChildList
      }
    }
  })

</script>

子组件

setup () {
  // 办法
  const getList = () => {
    console.log('子组件中的办法')
  }
  return {
    getList
  }
}

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理