如何调试 emberjs 计算属性答案

【问题标题】：How to debug emberjs computed property如何调试 emberjs 计算属性
【发布时间】：2017-08-24 23:34:45
【问题描述】：

假设我有一个依赖于其他属性的计算属性。如何找出依赖属性的哪些更改会触发对我的属性的重新计算。除此之外，还有什么方法可以调试计算链？

【问题讨论】：

我想没有简单的方法，您可能需要将计算属性与 getter 和 setter 一起使用，并与您之前的值进行比较
我查看了源代码，看看是否有任何我们可以从中受益的未记录功能；但没有运气。可能您可以在 ember 讨论中提问，核心团队中的某个人应该给出适当的答案。我相信您没有机会只能依靠观察者而不是计算属性来了解更改属性。祝你好运。

【解决方案1】：

如果您的计算属性在组件中，您可以尝试挂钩到didUpdateAttrs 挂钩。 didUpdateAttrs 当传入组件的值更新时触发。在 didUpdateAttrs 中，您可以通过比较旧值/新值来查看更改了哪些属性。

  didUpdateAttrs: function(attrs) {
    // attrs should have access to the old/new values

  }

https://guides.emberjs.com/v2.6.0/components/the-component-lifecycle/

didUpdateAttrs 在组件的属性发生变化时运行，但不是通过 component.rerender 重新渲染组件时， component.set，或模板使用的模型或服务的更改。

在重新渲染之前调用了一个 didUpdateAttrs，你可以使用这个钩子来更改特定属性时执行代码。这个钩子可以是观察者的有效替代方案，因为它将在重新渲染，但在属性更改之后。

配置文件编辑器组件就是这个场景的一个实际例子。当您正在编辑一个用户并且更改了用户属性时，您可以使用 didUpdateAttrs 清除任何由编辑前一个用户。

【讨论】：

请注意在生命周期钩子方法中使用attrs已被弃用

【解决方案2】：

检查属性是否由notifyPropertyChange() 方法触发。您可以使用notifyPropertyChange() 方法来触发计算属性。

【讨论】：

有一段时间notifyPropertyChange 被认为是私有API。我不鼓励使用它。这是一种气味；它的使用通常意味着代码需要重构。此外，它没有回答问题。

【解决方案3】：

也许LOG_BINDINGS 可以告诉你你需要什么。 https://guides.emberjs.com/v2.14.0/configuring-ember/debugging/#toc_log-object-bindings

我会做的是 set breakpoints 在被依赖的计算中。

【讨论】：