javascript - 在 stenciljs 中将值绑定为 html

Question

我无法将带有自定义 html 的值呈现到元素中。前任：

this.title = 'Hello <b> stencil </b>'; << response value from an API 

捆绑：

<h1>{this.title}</h1>

我期待与JavaScript 中的innerHtml行为相同的东西。

Answer 1

您可以使用

<h1 innerHTML={this.title} />

Answer 2

这在 JSX 中不是一个好的做法，它违背了虚拟 DOM 的想法，并且它没有创建虚拟节点。

你应该这样尝试

this.salute = 'Hello';
this.name='stencil';

捆绑

<h1>{this.salute} <b>{this.name}</b></h1>

或者，如果情况更复杂，请构建另一个更小的组件。

但是使用innerHTML会起作用，但应该在不同的情况下使用更多细节here（在页面底部）。