Как расширить Polymer.AppNetworkStatusBehavior в пользовательский Mixin в Polymer2?

В Polymer 1.0 у меня есть следующий фрагмент кода:

CustomBehaviorImpl = {
  properties: {
    // Define property here...
    // ...
  },
  // Other custom behaviors definition
  // ...
};

CustomBehavior = [
  Polymer.AppNetworkStatusBehavior,
  CustomBehaviorImpl,
];

Как бы я сделал это в Polymer 2.0, чтобы создать класс CustomMixin.


person Andrew See    schedule 23.10.2017    source источник


Ответы (1)


Если вы разделяете миксины в отдельный файл, вы можете ссылаться на них как на зависимость Html Import всякий раз, когда составляете элемент, который использует миксины. Просто дополните свой класс Polymer собственным поведением.

Я думаю, что на этот вопрос уже был дан ответ здесь, в stackoverflow.
Взгляните на этот:

Применение поведения с помощью миксинов JS в Polymer 2


Пример

Это мой CustomMixin.html

<script>

  // CustomMixin provides the _customMixin function

  var CustomMixin = function(superClass) {
     return class extends superClass {

        _customMixin() {

        }

     }
  }
</script>

Это мой полимерный элемент, в котором я использую CustomMixin.

<link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../CustomMixin/CustomMixin.html">
<dom-module id="my-element">
  <template>
    <style>
     :host {
        display: block;
    }
    </style>
  </template>
  <script>
    class MyElement extends CustomMixin(Polymer.Element) {
      static get is() { return 'my-element'; }
      static get properties() {
        return {
        };
      }
      ready() {
        super.ready();
      }

    }
    window.customElements.define(MyElement.is, MyElement);
  </script>
</dom-module>

На самом деле я никогда не тестировал этот код, но я считаю, что это должен быть способ реализовать собственный миксин.

person Niklas    schedule 23.10.2017
comment
Я прочитал Применение поведения с JS MIxins в Polymer 2, но не мог понять, как на самом деле работает код. Не могли бы вы дать фактический код, основанный на моем примере выше? - person Andrew See; 24.10.2017
comment
Я добавил пример того, как добавить пользовательский миксин, помещенный в дополнительный файл, в существующий элемент Polymer. Я использую гибридное поведение с элементами стиля класса. - person Niklas; 25.10.2017
comment
Я знаю об определении пользовательского миксина в соответствии с вашим примером, мой вопрос был как расширить Polymer.AppNetworkStatusBehavior в CustomMixin в Polymer2? - person Andrew See; 25.10.2017
comment
Ах, прошу прощения. Должен сказать, что я не совсем уверен, что это лучший подход, но я считаю, что вы можете расширить свой пользовательский элемент напрямую с ним или просто скопировать его в свой миксин, чтобы затем изменить его в соответствии с вашими потребностями. - person Niklas; 25.10.2017