我正在尝试将 Polymer 1.8 组件升级到 Polymer 2。
如文档中所述,behaviors
被类 mixin 替换,但我对这些并不是很有信心。经过一些搜索,关于如何替换 iron-resizable-behavior
,我无法找到如何构建它。
有没有人告诉我在哪里可以找到它的一些文档或/并解释我如何设计 mixin 以对事件使用react?
谢谢
最佳答案
混合行为
在 2.0-preview
branch of <iron-resizable-behavior>
, Polymer.IronResizableBehavior
是一种混合行为(即定义为对象而不是类混合)。 polymer 2 提供 Polymer.mixinBehaviors()
将一个或多个混合混合与一个类合并。
用法:
class NEW_CLASSNAME extends Polymer.mixinBehaviors(HYBRID_MIXINS_ARRAY, SUPERCLASSNAME) { ... }
示例:
class MyView1 extends Polymer.mixinBehaviors([Polymer.IronResizableBehavior], Polymer.Element) {
static get is() { return 'my-view1'; }
connectedCallback() {
super.connectedCallback();
this.addEventListener('iron-resize', this._logResizeEvent);
}
disconnectedCallback() {
super.disconnectedCallback();
this.removeEventListener('iron-resize', this._logResizeEvent);
}
_logResizeEvent(e) {
console.debug('resize', e);
}
}
window.customElements.define(MyView1.is, MyView1);
行为类混合
你可以 create a behavior-class mixin像这样:
const MyMixin = (superclass) => class extends superclass {
foo() {
console.log('foo from MyMixin');
}
};
然后,您可以像这样在 Polymer 元素中使用它:
class MyView1 extends MyMixin(Polmer.Element) {
onClick() {
this.foo(); // <-- from MyMixin
}
}
混合行为 + 行为类混合
您可以像这样一起使用混合行为和行为类混合:
class MyView1 extends Polymer.mixinBehaviors([Polymer.IronResizableBehavior], MyMixin(Polmer.Element)) {
onClick() {
this.foo(); // <-- from MyMixin
console.log(this._interestedResizables); // <-- from Polymer.IronResizableBehavior
}
}
关于ecmascript-6 - 如何为 Polymer 2 创建自定义元素 "resize"mixin?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42814962/