将对象传递到下一个同级组件

Question

我在AureliaJS组件中的结构是：

<parent>
  <child1> 
  <child2> 
</parent>

我在child1有一个对象，该对象是通过ajax请求获得的：

export class Child1 {   
  fechedObject = {}: 
}

我需要在第二个组件中具有双向绑定和可观察的属性

export class Child2 {   
  // I need this fechedObject here 
}

最好的方法是什么？

Answer 1

我相信这里最好的方法是在两个子模型上都使用双向绑定，以通过父代中的双向绑定来绑定模型。

在您的parent.html ，您需parent.html ：

<child1 fetched-object.two-way="fetchedObject"></child1>

<child2 fetched-object.two-way="fetchedObject"></child2>

在两个子视图模型中，您都将变量声明为bindable ：

bindable()
public fechedObject;

这样，在两个孩子中发生的所有编辑都将传递给另一个孩子。 如果你想防止编辑child2从影响对象child1 ，你可以简单地绑定使用单向fechedObject.one-way或fechedObject.bind您child2 。

Answer 2

您可以保留<child1/>视图模型引用并将其绑定到<child2/> ：

<child1 view-model.ref='child1'></child1>

<child2 data.bind='child1.fetchedObject'></child2>

所以child.data只需要是可绑定的：

export class Child2 {

  @bindable
  data
}