Ember.js 如何控制余烬组件观察者的执行顺序？

我在一个组件中有一个组件。子组件有两个通过模板传入的属性。这些属性在子组件的component.js中都有单独的观察者

当我以特定的顺序更新父组件中的绑定属性时，子组件的观察器以错误的顺序触发

如何控制观察者在子组件中激发的顺序

我的具体情况

有人向我指出，不再需要观察员了。但是它们仍然存在于余烬2.0中，因此必须要使用它们。无论如何，我会解释我的情况，希望你们中的智者能让我知道如何在没有观察者的情况下完成这项工作

在我的例子中，父组件是一个游戏的菜单，包含许多子菜单。要在每个子菜单之间切换，我使用幻灯片动画，以便当前菜单在屏幕外消失，新菜单进入，并根据需要交换两个动画菜单。在这种情况下，这是在儿童侧开关组件中完成的

父菜单包含选项卡，单击该选项卡时，需要与子侧切换器组件通信，此时应显示哪个子菜单，以及滑动两个属性的方向。首先需要设置方向，然后再设置子菜单，因为当子菜单更改时，会触发实际动画。余烬2.0哲学指出，行动不能下降，但数据属性可以下降，所以观察属性是我要走的道路

注意，在我的用例中，实际上只观察到菜单属性，但在调试时，我还必须观察方向属性，因为我的菜单到处都以错误的方式滑动

首先需要设置方向，然后再设置子菜单，因为当子菜单更改时，会触发实际动画。余烬2.0哲学指出，行动不能下降，但数据属性可以下降，所以观察属性是我要走的道路

我认为您可以通过使用didInitAttrs和didReceiveAttrs钩子来摆脱观察器。这些挂钩有助于一起处理属性，而不考虑顺序。详情：

让子组件具有属性方向和子菜单

您可以根据需要通过getAttr和process获取属性：

// child component
direction: defaultValue,
submenu: defaultValue,

didReceiveAttrs() {
 // your logic 
 this.set('direction', this.getAttr('direction') || defaultDir);
 this.set('submenu', this.getAttr('submenu') || defaultSumbenu);
}

---

警告：现在余烬指南和文档缺少对生命周期挂钩的解释。可以建议将其作为工作示例进行查看。

感谢Artych，实际上是didUpdateAttrs钩子解决了我的问题，因为我需要能够对其中一个属性的所有更改做出反应，而不是初始化

考虑到这样消耗的组件：

{{my-component myAttr=changeableAttr myOtherAttr=otherAttr}}

在component.js中：

didUpdateAttrsoptions{ 如果options.newAttrs.myAttr！==options.oldAttrs.myAttr{ //对组件外部的更改作出反应 } }, 这是在任何给定的运行循环中的所有属性更改之后激发的，并允许您在组件中以您喜欢的任何顺序进行处理

这也为我回答了如何向组件发送操作的问题，或者更准确地说，如何让组件对外部更改做出反应的问题

---

为了完整性起见，我还研究了如何更改观察员被激发的顺序：这只是他们在模板中的组件上定义的顺序。这是一个非常糟糕的设计，因此有一个更好的解决方案，形式是didUpdateAttrs或didReceiveAttrs。

也许您可以发布一些代码。观察者不是必需的，也不应该被使用：pI意味着通常情况下可以使用计算属性来解决问题。我可以发布一些示例代码，但它不会比我所解释的做得更好，并且无法传达我首先使用观察者的原因，这对解决这个问题更有价值。我已经在原来的问题中发布了我的案例。如果你能让我知道我如何在没有观察员的情况下做到这一点，我将非常感激。谢谢：我从这本书中得到了“不要用户观察者”的想法：邪恶的好余烬2015-Stefan Penner的“观察者提示罐”。你可以加一个小钩子。Ember.run.laterfunction{dostuff}，300；因此，您可以手动控制order@kristjanreinhold谢谢，那个视频非常有用。

{{my-component myAttr=changeableAttr myOtherAttr=otherAttr}}