聚合物0.8 Shady DOM

Posted 2021-04-12

使用Polymer 0.8引入的Shady DOM是否会阻止样式泄露到本地DOM中，或者只有Shadow DOM可以做什么？

https://www.polymer-project.org/0.8/docs/devguide/experimental.html#xscope-styling

在下面的示例中，Shady DOM会阻止标题变为红色吗？

我-element.html

<template>
    <span class="title">{{title}}</span>
</template>

styles.css的

.title {
    color: red;
}

答案

我一直在测试Polymer 0.8，到目前为止它似乎没有。不支持阴影边界规则，因为它将<dom-module>中定义的样式范围限定为Polymer元素，但不会停止从外部样式表泄漏。这里的文档暗示，虽然我不会说他们已明确说明：https://www.polymer-project.org/0.8/docs/devguide/local-dom.html#scoped-styling

编辑：我猜这将被修复为0.9或1.0，请参阅this post。虽然我发现this part的最后一点表明它现在应该可用，除非我遗漏了一些东西。