如何从另一个 Vue 组件触发 Mapbox 事件？

How to trigger Mapbox events from another Vue component?

我正在尝试将地图网站移动到 Vue。

该网站使用原版 JS，从 public API 中获取 JSON 并构建 1) 带有卡片列表的边栏和 2) 地图。

在 Vue 中，我将这两部分分成不同的组件似乎很明显，如下所示：

<template>
  <div>
    <CardsList :cards-data="this.info" />
    <Map :cards-data="this.info"  />
  </div>
</template>

因为 Mapbox 仅在地图组件中初始化，所以我很难在我的卡片列表中获取一些事件处理程序，因为它们应该与地图交互。它看起来非常复杂。

我做错了什么？地图是否应该在 App.vue 上初始化并且侧边栏是唯一的组件？ map.getLayer 之类的 Mapbox GL JS 表达式在组件上可用吗？

我通常使用的模式是使用 EventBus.

您可以查看此示例 here。