反射属性

Question

传递（内部）属性 更改[=18] 的目的 和用途 是什么=] 到（外部）观察到的属性？如果可能，请举一个外向的例子。

蒂亚

Answer 1

一个主要用例是 CSS 属性选择器可以使用该属性。这样您就可以轻松地根据状态进行条件样式设置：

:host([selected]) .foo {
  background-color: gray;
}

:host([mode="foo"]) .bar {

}

另一个用例可以将 属性 反映到 aria 属性，由屏幕阅读器解释：

static get properties() {
  return {
    checked: {
      type: Boolean,
      attribute: 'aria-checked',
      reflect: true,
    }
  };
}