我知道有一个关于多重继承/组合的问题。然而,这个问题似乎更多地涉及如何在其他元素中重用多个现有元素的功能。显然,这种情况下的解决方案是 mixins。
我想知道,如何实际“装饰”现有元素,而不是从它们那里借用功能。我们知道在 Polymer 中可以使用 extends
属性来扩展现有元素。
因此,让普通的 <button>
表现得像 mega-button
一样简单,只需添加 <button is="mega-button">
并编写其组件。但事实证明,无法 extend
多个元素。所以像 extends="foo bar"
这样的东西行不通。如果我想构建一个 Web 组件,可以应用于不同的元素呢?
mega-button
扩展 <button>
元素,还可能想扩展 <a>
元素,以便其看起来和表现得像 mega-button
一样?混入方法在这里并没有太大帮助(就我所知),因为它们不会提供不同 Web 组件的共享逻辑。也就是说,您需要创建多个组件,并从混入中重用逻辑。
我需要的是一种创建一个可以应用于多个元素的 Web 组件的方法。
有任何解决方法吗?
更新
Addy 提出了一些处理该用例的方法。以下是基于其中一种方法的后续问题: 如何在注册自己的 Polymer 中找出将要被扩展的元素?
还有一个关于在Polymer中是否可能在Web组件(和导入)之间共享mixin的问题。
更新2
我写了一篇文章,总结了我在使用Polymer时的继承和组合经验和教训:http://pascalprecht.github.io/2014/07/14/inheritance-and-composition-with-polymer/