Javascript 如何处理2个几乎相似的组件？

在一个页面中，我有两个组件，它们做几乎相同的事情，尽管其中一个具有另一个没有的功能性

考虑以下两个部分：

组成部分1

某物
导出默认值{
名称：“组件1”，
方法（）{
someMethod（）{}
}
}

构成部分2

某物
导出默认值{
名称：“组件2”，
方法（）{
someMethod（）{}，
someMethodSpecificToComponent2（）{}
}
}

如您所见，这两个组件非常相似，这使我想将它们分解为一个组件。然而，如果我这样做，那么方法

somemethodspecifictomponent2

有时将是无用的，因为它特定于一个用例，我认为这是反模式的。如果我不分解它们，就会有一些重复的代码，这也是最好避免的事情

另外，我可以将

someMethodSpecificToComponent2

放在一个mixin中，然后将这个mixin导入到需要这个函数的组件中，但我不确定这是最好的解决方案

---

处理两个几乎相同的组件的最佳方法是什么，无论是复制、保留未使用部分的因式分解、使用mixin的因式分解还是其他任何方法？

mixin解决方案既干净又简单。你担心什么？没什么问题。或者用

somemethodspecificttocomponent2

扩展Component2中的Component1方法。我觉得很奇怪。这看起来像是一个黑客，一个解决办法，因为我还没见过有人用这种方式混合。但那不过是一种感觉，这就是为什么我仍然对这个解决方案持开放态度。如果我不知道mixin解决方案不好的具体原因，我可能最终会使用它！

<template>
  <div>Something</div>
</template>

<script>
export default {
  name: 'Component 1',
  methods () {
    someMethod () {}
  }
}
</script>

<template>
  <div>Something</div>
</template>

<script>
export default {
  name: 'Component 2',
  methods () {
    someMethod () {},
    someMethodSpecificToComponent2 () {}
  }
}
</script>