Polymer 2.0:事件监听器添加事件监听器的理想位置在哪里?
我见过有人在“ready”函数中添加事件监听器,在“connectedCallback”函数中添加其他监听器。我的问题是,每个地方的优点和缺点是什么?在连接上,我们负责将其移除;在ready中,它将停留在那里,我不确定这是否是一个问题 我应该这样做吗:Polymer 2.0:事件监听器添加事件监听器的理想位置在哪里?,polymer,polymer-2.x,Polymer,Polymer 2.x,我见过有人在“ready”函数中添加事件监听器,在“connectedCallback”函数中添加其他监听器。我的问题是,每个地方的优点和缺点是什么?在连接上,我们负责将其移除;在ready中,它将停留在那里,我不确定这是否是一个问题 我应该这样做吗: connectedCallback() { super.connectedCallback(); this.addEventListener('click', this.myFunction.bind(this)); } dis
connectedCallback() {
super.connectedCallback();
this.addEventListener('click', this.myFunction.bind(this));
}
disconnectedCallback() {
super.disconnetedCallback();
this.removeEventListener('click', this.myFunction);
}
ready() {
super.ready();
this.addEventListener('click', this.myFunction.bind(this));
}
或此:
connectedCallback() {
super.connectedCallback();
this.addEventListener('click', this.myFunction.bind(this));
}
disconnectedCallback() {
super.disconnetedCallback();
this.removeEventListener('click', this.myFunction);
}
ready() {
super.ready();
this.addEventListener('click', this.myFunction.bind(this));
}
直到Polymer
1.x.which
,元素生命周期中的ready
回调被调用一次
- 元素注册了它的影子DOM
- 已分发任何
ready
,attached
被触发
因此,您可能已经使用了ready
作为一次回调,在一切都确实ready
随着Polymer 2.0的推出,合同中的回调方式发生了变化,以及
- 新的
分发后,不再保证执行
回调。这意味着,不能保证ready本身会等待content/light DOM分发ready
现在是新的attached
,对于元素级DOM操作(如设置属性、附加子项等)非常有用。这是一个生命周期更改,发生在插槽节点分布之后,并且元素本身附加到DOM层次结构中,但是不一定是在油漆之后connectedCallback
:slotted
内容的事件,请使用ready
回调
对于需要了解所有分布式内容以及影子DOM的任何内容,请使用connectedCallback
但是,如果可能,在元素的回调中使用super类Polymer
的afterNextRender
方法来添加事件侦听器
这些是我可能想到的
所有这些,还有更多,如果有帮助的话
我还没有读到我们必须从生命周期回调中删除事件侦听器之类的内容
如果您所指的情况是,元素本身可能动态连接和断开连接/或在事物流中
考虑到这一点,您正在元素生命周期回调中的全局/本机元素上添加事件侦听器
就像在自定义元素的就绪或连接的回调中的窗口上附加事件侦听器一样
只有在这种情况下,polymer才建议您删除断开连接上的事件侦听器。现在,我还要检查about AfertnextTrenderYeah。我自己也没用过,但一定是为了防止渲染块,请检查一下,干杯@在大多数情况下,分配事件侦听器的最佳时间越早越好。我通常使用构造函数并在其中定义我的事件侦听器。