如何使用Polymer擴展多個元素

Question

我知道有關於多重繼承/組合的這個問題。 但是，似乎這個問題更多的是關於如何從其他元素中的多個現有元素重用功能。 顯然，解決方案就是mixins。

我想知道，如何在不真正借用現有元素的情況下實際“裝飾”現有元素。 我們知道可以使用這個extends屬性來擴展Polymer的現有元素。

因此，使普通的<button>表現得像一個mega-button就像附加<button is="mega-button">並為其編寫一個組件一樣簡單。 但事實證明， extend多個元素是不可能的。 所以像extends="foo bar"類的東西不起作用。 如果我想構建一個可以實際應用於不同元素的Web組件，該怎么辦？

例如，我不想只使用mega-button擴展<button>元素，但也可能只是一個<a>元素，以便它看起來像行為像一個mega-button ？

mixin方法在這里並沒有真正幫助（據我所知），因為它們不再為不同的Web組件提供共享邏輯。 這意味着，您可以創建多個組件，並從mixin重用邏輯（打包在mixin中）。

我需要的是一種創建一個可以應用於多個元素的Web組件的方法。

知道如何解決這個問題嗎？

UPDATE

Addy回答了一些處理該用例的方法。 這是基於一種方法的后續問題

如何在Polymer中注冊我自己的元素時，如何找出要擴展的元素

另一個是否有可能在Polymer中分享Web組件（和導入）中的mixin？

更新2

我寫了一篇文章，總結了我對聚合物遺傳和組成的經驗和學習： http ： //pascalprecht.github.io/2014/07/14/inheritance-and-composition-with-polymer/

Answer 1

如果您只需要一個支持應用於多個元素的導入，那么您的元素可能包含多個元素定義，這些定義可能會也可能不會利用Polymer.mixin來共享您的裝飾元素之間的功能。

所以pascal-decorator.html可以包含<pascal-span>和<pascal-button> Polymer元素定義，兩者都是pascal-decorator.html定義的某個對象的邏輯混合。 然后你可以執行<button is="pascal-button">和<button is="pascal-span">同時這樣做的邏輯仍然在同一個導入中。

替代方案（如果您嚴格要在一個自定義元素中執行此操作，imo，使其不那么干凈）是執行諸如檢查要擴展的元素類型之類的操作，這可以以鏈接到的方式完成，也可以通過檢查元素注冊過程的一部分。

一般來說，我個人更喜歡弄清楚我可能需要在可以修飾的元素之間共享什么邏輯，將該功能分離為元素然后將它們導入到具有標記知識的專用元素中（例如<addy-button> ， <addy-video>等）。