我必须将 props 从父组件传递到子组件的子组件。请帮忙，因为我是 Vue.js 的新手
parent component --> child component --> child component
我从跟随页面和连接页面的不同组件的成员目录组件调用 rolodex，但我需要知道它是从哪里调用的 rolodex 组件？这样我就可以在 rolodex 组件中显示，例如“从 调用的 rolodex”
我从多个组件调用<Rolodex>。
<Follow Component>---><member directory>---><rolodex>,<search-results>
<Connections component>--><member directory>---><rolodex>,<search-results>
【问题讨论】：
标签： javascript vue.js vue-component
使用 EventBus，在 main.js 文件所在的根目录中创建一个 js 文件，我将其命名为 event-bus.js 并添加以下内容：
import Vue from 'vue';
const EventBus = new Vue();
export default EventBus;
然后在您需要的任何组件中导入您的 EventBus：
import EventBus from '@/event-bus'
这样发送：
let data = 'data'
EventBus.$emit('test', data)
这样接收：
EventBus.$on('test', (data) => {
console.log(data)
})
这更深入地解释了它：https://medium.com/easyread/vue-as-event-bus-life-is-happier-7a04fe5231e1
【讨论】：
你有几个选择。
你可以只传递道具，一次一个组件。每个组件将相关值传递给需要它们的子级。这应该是您的默认选项，但它存在一些问题：
另一种选择是provide/inject：
https://vuejs.org/v2/guide/components-edge-cases.html#Dependency-Injection
https://vuejs.org/v2/api/#provide-inject
这通常被认为是一项高级功能，使用它有几个注意事项。但是，它确实允许组件将“远程道具”传递给后代，跳过中间的任何组件，而他们对此一无所知。
如果数据更改需要传回源，它可能会变得很棘手，因为provide/inject 只在一个方向上真正起作用。如果数据作为引用类型传递，则可以直接在后代中对其进行修改，尽管这将被视为违反单向数据流。理论上可以通过provide/inject 传递一个回调函数来代替事件。这一切都变得有点混乱。
当数据需要在组件树中跳转时，标准的解决方案是 Vuex 存储：
我不会详细介绍 Vuex，其他地方已经写了很多关于它的文章，但关键思想是数据存储在单例中，可以从应用程序的任何位置访问。
在这个问题的上下文中，问题可能是上下文。如果您同时显示多个rolodex 实例，它们将在商店中查看相同的状态。它一次只对单个实例有效，由祖先设置状态，后代读取它。
【讨论】：