如何强制 Ember.Component 重新渲染？答案

【问题标题】：How to enforce Ember.Component to rerender?如何强制 Ember.Component 重新渲染？
【发布时间】：2017-11-13 22:06:06
【问题描述】：

有没有办法让 Ember.Component 强制重新渲染？

有.rerender() 方法，但没有帮助。我也尝试使用.notifyPropertyChange 模板，layoute - 相同

现在对于这种情况，我需要将一块模板包装到 if 包装器中并切换标志的值。但这种方式既丑陋又无聊。

有什么想法吗？

【问题讨论】：

我也遵循相同的方法 if 块与切换标志的值..一段时间。希望有一些东西可以强制销毁并重新渲染组件
为什么需要重新渲染？
正如@ykaragol 的评论所暗示的，您不需要强制重新渲染组件（至少我想不出理由）。也许您可以详细说明为什么需要这样做（或者更好的是，提供一些代码来说明原因）？ Ember 的渲染引擎快速的部分原因是它只在必要时重绘 DOM 的一部分（例如，如果支持数据对象已以某种方式修改）。如果我们能更好地理解原因，我们可能会建议更符合 Ember 工作原理/性能比重新绘制整个组件更好的替代方法。
@MichaelBoselowitz 在我的情况下（用于 UI 测试）我想更改一些影响助手行为（ can-helper ）的值，但我不想让它可观察，因为它仅用于测试
@MichaelBoselowitz 另一个案例 - 我们需要动态更改 tagName

【解决方案1】：

我的一个组件也有同样的问题。正如社区所说，如果您正确使用 ember 模式，则不必这样做。

但是，由于是针对特定案例，我找到了解决方法。

您必须在 routes/somefile.js 中创建一个操作才能像这样刷新：

actions: {
  refresh() {
    this.refresh();
  }
}

并在您的组件视图中，添加一个隐藏按钮以单击路由器的操作，如下所示

<button id="refresh_invoice" class="hidden" {{action 'refresh'}}></button>

在您的组件中，使用 Jquery，您将能够单击隐藏按钮，这将刷新组件。

这不是一个很好的修复，但它的工作。跳它会有所帮助。

【讨论】：

refresh 会强制组件重新渲染，但不会完全拆除组件并重新绘制。
您能提供文档的链接吗？可以在API中找到.refresh方法
emberjs.com/api/ember/2.15/classes/Ember.Route/methods/… 但@kumkanilliam 是对的，它会注意到完全重绘组件，但如果它只是为了刷新一些数据，它可能对你有用，因为它对我有用

【解决方案2】：

看看Ember Run Loop

要覆盖此“后台”进程，您可以使用以下内容：

showElement: false,

actions: {
  buttonClick() {
    Ember.run(()=> {
      this.toggleProperty('showElement');
    })
  }
}

这将强制运行循环重新启动，而不是 Ember 处理任何属性更改并决定应如何执行代码，就像 JavaScript 事件循环一样。

可以在here找到一个很好的解释

【讨论】：

我需要重新渲染组件 - 它对我有什么帮助？
如果你理解了 ember 运行循环，你就会明白如何重新渲染一个组件
已编辑我的答案以包含一个示例。如果您有一个按钮可以在操作哈希中切换 buttonClick 方法，则执行 Ember.run 语句中所需的任何逻辑 - 这将重新运行 ember 循环并呈现组件。
检查下一个ember-twiddle.com/…