vue3一个组件触发另外一个组件中定义的方法
时间: 2023-08-25 21:19:49 浏览: 43
你可以使用事件总线(Event Bus)来实现组件之间通信。具体步骤如下:
1. 在你的项目中创建一个事件总线(Event Bus):
```javascript
import { createApp } from 'vue';
const app = createApp({});
const eventBus = app.config.globalProperties.$eventBus = new app;
export default eventBus;
```
2. 在需要调用方法的组件中,使用 `$emit` 方法触发事件:
```javascript
import eventBus from './eventBus';
export default {
methods: {
handleClick() {
eventBus.$emit('eventName', data);
}
}
}
```
3. 在需要监听事件并执行方法的组件中,使用 `$on` 方法监听事件:
```javascript
import eventBus from './eventBus';
export default {
created() {
eventBus.$on('eventName', this.handleEvent);
},
methods: {
handleEvent(data) {
// 执行需要执行的方法
}
}
}
```
这样,当触发 `eventName` 事件时,监听该事件的组件中的 `handleEvent` 方法就会被执行。