一个组件的多个实例的 CANJS3

Question

使用 CanJS (3)，我尝试插入两次相同的组件，但行为不同。 "父"状态如下所示：

<div class="container-fluid contents">
<...>
<my-component someParameters="value1"></my-component>
</...>
<...>
<my-component someParameters="value2"></my-component>
</...>
</div>

由于子级绑定，该参数正在进入子视图模型，这是一个简单的 DefineMap。

子组件很简单：

export default Component.extend({
tag: 'my-component',
viewModel: myviewmodel (a DefinedMap, with a can-connect attribute, and some others attributes),
view: view (some stache file),
events: {
'inserted': function(el) {
console.log('inserted my-component...');
},
}
});

到目前为止一切顺利，我实现了在同一窗口中同时拥有两者，并且在显示自定义参数时，它显示了差异。

但随之而来的是麻烦。 两个子组件都有一个连接(在视图模型中)，我希望连接到相同的IP，但订阅不同的通道。

看起来 CanJS 实际上并没有实例化两个不同的视图模型，所以我最终得到了我的 can-connect 对象的相同实例，这使得工作变得不可能......

如果有人知道如何在同一页面上有两个组件但具有两个不同的范围，我将很高兴阅读它。

编辑： 真正的问题是"模型"(即viewmodel.connect对象)的非单一性

Answer 1

解决方案：

can-connect 对象必须位于闭包中：

var behaviors = function() {return connect([
someBehavior,
anotherBehavior
],
{
url: {
getListData: "GET myURL"
}
})
};

并且定义映射必须像：

var MyMap = DefineMap.extend({
connection: {value: behaviors},
parameters: ...
}

一些有趣的阅读： 值属性文档