时间戳

首页 > 解决方案 > 从父级（App.vue）到另一个组件的 Vue 事件

javascript - 从父级（App.vue）到另一个组件的 Vue 事件

问题描述

我想发出一个事件，App.vue该事件是一个主要组件到另一个组件。 EventBus.$emit来自 App.vue，EventBus.$on在子/另一个组件上不起作用。由于这些之间没有直接的子关系，我也不能@custom-event=""使用

如何将事件从App.vue另一个组件抛出？

我就是做这个的。它正在工作所有其他组件。这是我的组件的文件夹结构

-src
-pages
  -main-page
    -MainPage.vue  $on
-event
-constant
-store
-router
App.vue  --> $emit
main.js

标签： javascriptvue.jsvue-events

解决方案

你说 EventBus 方法不起作用，但它应该是这样，所以我假设你做错了。做这样的事情：

创造eventBus.js

import Vue from 'vue';
export const EventBus = new Vue();

在您的任何单个文件组件中，将其导入：

import { EventBus } from '/src/path/to/eventBus.js';

在组件中触发事件：

EventBus.$emit('some-event-raised', { someData: "bob" })

在任何其他组件中，再次执行导入，然后收听：

EventBus.$on('some-event-raised', obj => {
  console.log(`some-event-raised triggered [${obj.someData}]`)
});

推荐阅读