在vue事件总线发送的对象的访问值js

我使用evntbus在第一个中的两个组件之间传递数据时，我点击按钮提交的函数是这样执行的，我发送对象数组到另一个组件在vue事件总线发送的对象的访问值js

submitted(){ 
    this.products.push(this.product); 
    EventBus.$emit('prod', this.products); 
}

和在另一种组分：

created(){ 
    EventBus.$on('prod', function (productObject) { 
    console.log('event received!', userObject); 
    this.produc = productObject.products 
    console.log('The product: ', this.produc) 
    }.bind(this)); 
    console.log('User outside eventbus:', this.produc); 
}

的问题是，我不能访问到在第二组件与eventbus传递的对象不能任何一个帮助我？的productobject的值是

image

来源

2017-09-05 mar

您可以登录'productObject'到控制台？你确定它包含'products'属性还是数组？ – Tomer

https://i.stack.imgur.com/22hl7.png – mar

从您附加的日志判断，productObject是一个包含一个元素的数组 - 当您发出this.products而不是this.product。 – raina77ow

首先，它应该是EventBus.$emit('prod', this.products);，因为你散发出的EventBus的事件，而不是组件上。

其次，您将this.products（数组）传递到事件总线，但似乎将它视为处理函数中的单个对象。此外，你试图访问它（产品）的任意值，显然认为事件数据对象以某种方式记住它存储在哪个变量中。但事实并非如此。

因此，基于你是否真的需要通过产品进入EventBus整个数组，你有两个选择：

1）如果你确实需要this.products其他地方访问它的最后一个元素中的其他组件：

EventBus.$on('prod', function(products) { 
    this.product = products[products.length - 1]; 
    console.log('The product: ', this.product); 
}.bind(this));

2）如果没有，只发送单一的产品，并直接使用它：

EventBus.$emit('prod', this.product); 

// ...and in another component 
EventBus.$on('prod', function(product) { 
    this.product = product; 
    console.log('The product: ', this.product); 
}.bind(this));

来源

2017-09-05 13:53:27 raina77ow

thnx您的回复我犯了一个错误，当我复制代码我写它就像你说的，但我不能访问第二部分中的值 – mar

在vue事件总线发送的对象的访问值js

回答

相关问题