如何在不使用“ params”的情况下在Vue同级组件之间传递值？

Question

目前，我有2个组件：

• Proyectos.vue
• Reuniones.vue

哪里：

• Proyectos ：这是我在App开头显示的组件，其中显示了项目列表。

• Reuniones ：这是显示项目会议列表的组件。

在Proyectos组件中，我发出GET请求，该请求返回一个对象数组，即proyectos。 使用此项目列表，我可以填写表格。

Proyecto对象结构：

    {
        objetivo:"", 
        fecha: "",
        reuniones: [
        {
            titulo: "",
            fecha: ""
        },
        {
            titulo: "",
            fecha: ""
       }]
   }

对于每个表格行，我都有一个项目javascript对象，我想在单击按钮时将其发送到Reuniones组件。 进入Reuniones组件后，我将执行某些操作，例如对其进行迭代。

决定不使用参数

我正在寻找一种不必通过URL发送Id并不必重新get对象的方法。 我想使用Proyectos组件中已经包含的对象。

尝试使用事件

我尝试使用$emit和$on使用事件$on但是由于尚未加载Reuniones组件，因此无法听到从Proyectos组件发送的事件。

Proyectos.vue：

projectSelected (project) {
     // I issue an event with the project object
     this.$root.$emit ('send', project)
     // I call the route 'reuniones' to load the Reuniones.vue component
     this.$router.push('reuniones')
}

Reuniones.vue

this.$root.$on('send', (data) => {
     console.log (data)
})

---

我正在寻找的行为是能够在组件之间使用对象。

Answer 1

我认为您可能会考虑称为eventBus的全局状态，您可以在此处阅读

它将允许您为get请求创建make there方法，并使用计算的属性或观察程序监视.vue实例上的更改。