将数据从子组件传递到子组件Vuejs 2答案

【问题标题】：Passing Data From Child component to Child Component Vuejs 2将数据从子组件传递到子组件Vuejs 2
【发布时间】：2017-10-03 09:18:55
【问题描述】：

我误解了将子组件传递给其他子组件的文档。

我有两个组件

index.html

<main-categories-products source="{{ url('api/products') }}">
</main-categories-products>

<sidebar-options> </sidebar-options>

我的 app.js

 var app = new Vue({
  el: '#app',
  components: {
    MainCategoriesProducts,
    SidebarOptions
  }

})

MainCategoriesProducts.vue

import Vue from 'vue'
var bus = new Vue()
    export default{
        props: ['source'],
        created(){

            this.fetchedProduct()
        },
        methods: {

            fetchedProduct: function(){


                        var data = [1,2, 3];

                        bus.$emit('did-something', data);


            }
        }
    }

我的 SidebarOptions.vue

import Vue from 'vue'
    var bus = new Vue()

    export default{

        data(){

            return {

                someData: {}
            }
        },

        created(){

            bus.$on('did-something', data => this.someData = data);
            console.log(this.someData)

        }
    }

没有错误，但我无法从 MainCategoriesProducts 获取数据到 SidebarOptions。我怎样才能得到这些数据 = [1, 2, 3]？ TY

【问题讨论】：

标签： vue.js components

【解决方案1】：

你正在创建两个不同的总线，你应该只创建一个。

在 app.js 中添加这个

window.bus = new Vue();

然后删除

var bus = new Vue()

来自您的每个组件。

【讨论】：

@Rbex 很高兴为您提供帮助 :)