vue3 - defineExpose的使用(父组件调用子组件方法vue3 <script setup>版)
在使用单文件组件创建一个子组件时,可能遇到父组件需要调用子组件的方法,或者访问子组件的变量,在使用vue2或仅标签中只需要子组件上写一个ref='xxx'变量,父组件通过this.$refs['xxx']就可以直接访问子组件的方法或变量。实现如下:
如子组件有一个方法clear(),vue2或非setup用法时,非的父组件是这么调用的:
<子组件 ref="childRef" />
这里子组件里只要声明了的变量,父组件就可以直接访问到。但是子组件是时,父组件直接调用就会提示clear方法未定义。官网有这么一句话:使用
如此一来,非父组件就能直接通过this.$refs['xxx']调用子组件的方法了,如果父组件也是的话,只要用vue3的方法取到这个子组件的ref同理调用。