Question

例如：list-view和list-item

我用它们作为：

<list-view>
   <list-item><list-item>
   <list-item><list-item>
   <list-item><list-item>
</list-view>

但是，如果<list-item>元素是<list-view>的孩子，我如何使{{1}}元素有效？

有没有正式的方法在聚合物中做到这一点？

为了使其更清晰，有时我会创建聚合物元素，用于内部和仅在另一个聚合物元素内使用

Answer 1

所以，这里简短的答案是否定的。我认为作为一般规则，元素不应该对其父元素有任何了解。您可以拥有仅显示<list-item>个孩子的父元素，但它是否会添加任何内容以使<list-item>不会出现在<list-view>之外？

要从vanilla HTML中获取示例，<option>只在<select>，<optgroup>或<datalist>元素中才有意义，但您可以在其他地方放置一个浏览器没有抱怨。同样，如果我在<source>之外添加了<video>标记，我就不会看到控制台消息（至少在Chrome和Firefox上）。

如果您想在这种情况下做一些特别的事情，可以检查attached回调中的父节点。类似的东西：

attached: function() {
  if (this.parentNode.localName !== 'list-view') {
    ...
  } else { 
    ...
  }

当然，如果您这样做，并且下周您想出一个可以重复使用原始<grid-list-view>的精彩<list-item>，您需要返回并更改您的列表项。所以我会谨慎使用这种模式，只有当你看到限制你的组件可以使用的地方时才有明显的好处。

仅当元素是另一个元素的子元素时才考虑元素

1 个答案: