创建一个由两个组件“混合”的组件(从两个组件扩展)

Question

我正在构建一组组件，这些组件可以在它们的行为中包含变体。

更具体地说，我有一个x-tag组件，它可以表现为一个简单呈现文本的<span>，或者一个也呈现文本和链接到另一个路由的<a>。

对于“链接”部分，我使用Ember提供的链接组件 (即link-to)来不自己重新实现所有路由逻辑。

理想的应该只有两个组件：

• x-tag，处理基本逻辑的简单文本版本。
• x-tag-link-to，链接版本，应该是从link-to和x-tag组件扩展的组件。

由于不能从两个组件扩展，所以我将x-tag组件中的逻辑移到tag混频器中。所以这些组件的结果是这样的：

• x-tag，实现tag混和的组合。
• x-tag-link-to，扩展link-to组件并实现tag混和的组合。

这解决了问题，但混淆了在几个文件中的逻辑，而且我还有更多的组件，比如标签，它也有链接版本，用许多包含几乎整个组件逻辑的mixins文件夹填充。，只是感觉不对，，还是这是正确的方法？

如果需要，我可以提供代码示例。

Answer 1

正如Gennady在评论中所说，我最终使用了mixins。

其结果是：

• mixins/components/x-tag：具有标记组件逻辑。
• components/x-tag：实现混音的空组件。
• components/x-tag-link-to：扩展link-to组件以实现混音。

我放弃了组合，尽管这似乎是正确的路径，但从长远来看，将内部组件的实现映射到包含的组件将是一场噩梦。