Ember无标记组件innerhtml

Question

我在Ember中有一个无标签组件，并希望在生命周期钩子上使用innerHtml（this.element）（例如didRender）。当我使用this.element时，该值始终为null。当我向组件添加一个标记名（tagName: 'div'）时，我有组件的innerHtml this.element，但我可以在不设置tagName的情况下获取innerHtml吗？

Answer 1

this.element未向您innerHTML，它会为您提供真实的HTML Element。根据定义，无标记组件本身没有任何Element。所以this.element必定为空。

我们没有添加等效属性来检索Range（这是您需要表示DOM的无标记组件的区域）的最大原因是，与this.element不同， Range可能会在组件的生命周期内发生变化。使其完全可观察将是昂贵的，并且使其不可观察将使得创建错误变得非常容易。

大多数常见用例都包含在Gaurav建议的内容中：明确标记您真正想要查找的元素并通过querySelector或querySelectorAll访问它们。

如果你正在做一些非常喜欢的事情，并且你知道它只是一个可以过时的快照，那么逃生舱就是Ember.ViewUtils.getViewBounds。它没有被标记为公开，但它依赖于像Ember Inspector这样的官方项目，所以我们绝对不会在没有警告的情况下打破它。与任何使用频繁的非公共API一样，我们会发出弃用警告并等待完整的LTS循环。

在Ember.ViewUtils.getViewBounds的情况下，可以强有力地将其标记为公开，如果有人为此编写RFC，我认为我们可以就此达成共识。

Answer 2

是的，这已经破了。有关详细信息，请参阅https://github.com/emberjs/ember.js/issues/13627。

此处已发布变通方法：https://github.com/emberjs/rfcs/issues/168但是，它使用私有api，并且可能在未经警告的情况下在将来的版本中中断。

我的建议是通过tagName使用一个元素，因此this.element存在，或者在组件的父元素上放置一个类，以便您可以使用document.querySelector('.class-name').innerHTML - 但这需要父元素知道。