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

我在子组件里定义的 const someMethod = () => {} 可以被调用吗
在组合式API中,如果在子组件中仅仅是定义了一个常量或方法 const someMethod = () => {}，那么该方法是无法被父组件直接调用的。
这是因为在组合式API中，子组件需要通过 defineExpose 主动暴露出需要给外部访问的属性或方法。如果没有使用 defineExpose，那么子组件内部定义的常量、方法等都是私有的，外部无法直接访问。
所以，为了让父组件可以调用子组件中定义的方法，你需要在子组件中这样做：
  
<script setup>
const someMethod = () => {
  console.log('Child method called')
}
  
// 使用defineExpose将someMethod暴露给外部
defineExpose({
  someMethod
})
</script>
  
在上面的代码中，我们使用了 defineExpose 函数，将 someMethod 方法暴露给了外部。这样，父组件就可以通过模板ref或者渲染器refs来调用该方法了。
如果子组件中有多个需要暴露给外部的属性或方法，可以将它们作为对象的属性传递给 defineExpose：
defineExpose({
  someMethod,
  someData,
  ...
})
  
Vue3组合式API 父组件调用子组件的方法:
<template>
  <child-component ref="childComponent" />
  <button @click="callChildMethod">Call Child Method</button>
</template>

<script setup>
import ChildComponent from './ChildComponent.vue'
import { ref, onMounted } from 'vue'

const childComponent = ref(null)

const callChildMethod = () => {
  childComponent.value.someMethod()
}

onMounted(() => {
  // 在mounted钩子中,childComponent.value已经是子组件的实例
  console.log(childComponent.value)
})
</script>