dart - 如何在 polymer 自定义元素中渲染阴影 DOM

Question

我很难让我的 polymer 自定义元素在容器内渲染内容 <div>没有 <div>显示在 light DOM 中。

<polymer-element name="impress-slide" constructor="ImpressSlide" attributes="exitAnimation entryAnimation">
        <link rel="stylesheet" href="animate-custom.css">
        <template>
            <style type="text/css">
                ...
            </style>
            <div>
                <content></content>
            </div>
        </template>
        <script type="text/javascript">
                ...
        </script>
</polymer-element>

渲染为

<impress-slide>
     <div> (Content) </div>
</impress-slide>

任何人都可以给我一些关于如何渲染包含 <div> 的见解吗？在影子 DOM 中？

Answer 1

这取决于您使用的浏览器和版本。其中一些具有旧版本的 Shadow DOM 规范，因此 Polymer 必须对其进行填充，而不是在 native 使用它来获取所需的功能。

我使用的是 Chrome 33.0.1750.22 dev，除非我在 about:flags 中打开“启用实验性 Web 平台功能”标志，否则 Shadow DOM 仍会被填充。