页面不会渲染扩展的Polymer元素

Question

我正在尝试扩展Polymer核心选择器，但它不会在网页上呈现。 当我将<shadow></shadow>放入template - 标记时，它会进行渲染。

我不确定这是不是真正的问题。阴影标签的目的是什么？我在API文档中找不到相关信息。

以下是示例的链接：http://jsbin.com/qucitiwe/3/edit?html,console

Answer 1

您可以在Polymer文档的Extending other elements部分找到有关如何扩展元素的一些信息。

shadow 元素在此确切位置呈现父元素的阴影DOM（父元素模板元素内的DOM）。因此，如果没有 shadow 元素，您将看不到父元素中的任何DOM。

此外，子元素可以使用自己的内容包装父级的shadow DOM，例如：

<template>
  <div>Title</div>
  <shadow></shadow>
  <div>Footer</div>
</template>