vue3 怎么调用其他组件的方法
时间: 2023-10-13 16:13:40 浏览: 162
在 Vue3 中,你可以使用 `ref` 来获取其他组件实例,然后调用该组件的方法。
首先,给需要调用的组件添加一个 `ref` 属性:
```html
<template>
<div>
<OtherComponent ref="otherComponentRef"></OtherComponent>
</div>
</template>
```
然后在组件中使用 `$refs` 来获取该组件的实例,进而调用该组件的方法:
```javascript
import { defineComponent } from 'vue'
import OtherComponent from './OtherComponent.vue'
export default defineComponent({
components: {
OtherComponent
},
methods: {
callOtherComponentMethod() {
this.$refs.otherComponentRef.otherComponentMethod()
}
}
})
```
这样就可以在当前组件中调用 `OtherComponent` 组件中的 `otherComponentMethod` 方法了。需要注意的是,`$refs` 是一个响应式的对象,所以如果 `OtherComponent` 的实例是动态创建的,需要在组件渲染后才能访问它。
阅读全文