Question

让我们说我想写一组mixins。据我了解，每个mixin应该提供一些功能，不会影响或依赖任何其他mixin（除非它直接扩展另一个mixin）。

所以我写这样的东西：

const MixinA = superClass => class extends superClass {
  connectedCallback() {
    this.addEventListener('click', this.handleClick_);
  }

  /**
   * @return {Array.<string>}
   */
  static get observers() {
    return [
      'handleMyPropChange_(myProp)',
    ];
  }
}

然后我添加这样的东西：

const MixinB = superClass => class extends superClass {
  /**
   * @return {Array.<string>}
   */
  static get observers() {
    return [
      'handleMyPropChange_(myProp)',
    ];
  }
}

如果我将这两个mixins应用于同一个元素，那么handleMyPropChange_中的一个将被隐藏，第二个将被触发两次。

在此示例中，使用和handleClick_可能会出现同样的问题。

Polymer v1行为没有这样的问题。

我发现的唯一方法是为每个私有类成员添加一些mixin特定的前缀，以赋予它们唯一的名称，但它看起来不是很方便，处理这个问题的最佳选择是什么？

Answer 1

在Polymer 2中，您正在扩展一个类。这意味着只有任何给定名称只能有一个函数。您基本上用最新的覆盖了先前定义的函数。该函数触发两次，因为每个mixin正在注册一个观察者，这些不会重复数据删除。

如果函数在逻辑上相同，我会将其抽象出来。如果它们在逻辑上不同，我会根据函数的作用提供不同的更清晰的名称。

Polymer v2.0：如何编写可重用的mixin代码

1 个答案: