vue3中如何获取子组件的数据或调用其方法

726 阅读1分钟
  • 学过vue2的我们知道,父组件想直接调用子组件的属性或方法需要通过this.$refs.XXX来实现,vue3同样是通过ref属性来获取子组件的属性或方法,
  • 首先先来通俗的讲下V3和V2的区别,V3 和 V2 的区别就像是你用不同的语言或者方言说同一句话,学习 Vue3 并不代表你需要新学习一个技术,Vue3 的底层开发思想,跟 Vue2 是没有差别的。
  • 但是如果直接调用子组件中的方法会产生报错

image.png

  • 来看看官方文档的解释

image.png

c109359cc73f3426d71c9b92cdc0271.png

  • 想获取到子组件中的数据和方法需要通过defineExpose方法将需要被调用的属性或者方法暴露出去,直接上代码!

父组件 image.png 子组件

image.png