如何强制Polymer.Element扩展类执行其生命周期而不将其附加到dom?
考虑此要素(就问题而言,最小): 如果我得到一个实例并设置属性时间 属性time会更改,但不会调用observer和\u startCountDown()函数。我相信Polymer正在等待实例连接到DOM,因为事实上,当我将这个元素添加到文档中时,倒计时开始,5秒钟后控制台会记录倒计时代码>如预期如何强制Polymer.Element扩展类执行其生命周期而不将其附加到dom?,polymer,lifecycle,polymer-2.x,Polymer,Lifecycle,Polymer 2.x,考虑此要素(就问题而言,最小): 如果我得到一个实例并设置属性时间 属性time会更改,但不会调用observer和\u startCountDown()函数。我相信Polymer正在等待实例连接到DOM,因为事实上,当我将这个元素添加到文档中时,倒计时开始,5秒钟后控制台会记录倒计时如预期 我的目标是在不向文档附加任何内容的情况下执行此生命周期,因为MyCountDown的实例并不总是附加到视图,而是/并且它们需要是web应用程序不同组件之间的实时代码 一种解决方案是将新的MyCountDo
我的目标是在不向文档附加任何内容的情况下执行此生命周期,因为MyCountDown的实例并不总是附加到视图,而是/并且它们需要是web应用程序不同组件之间的实时代码
一种解决方案是将新的MyCountDown实例附加到dom的隐藏元素,以强制聚合物生命周期,但我认为这不是那么直观。我不知道确切的调用位置,但您遇到的问题是财产评估员不到位 我想你可能会从谷歌I/o的演讲中得到一些线索 在构造函数回调中调用this.\u enableProperties()
class MyCountDown extends Polymer.Element
{
static get is () { return 'my-count-down'; }
static get properties ()
{
return {
time: { /* time in seconds */
type: Number,
observer: '_startCountDown'
},
remains: Number
}
}
_startCountDown ()
{
this.remains = this.time;
this.tickInterval = window.setInterval(() => {
this.remains--;
if (this.remains == 0) {
console.log('countdown!');
this._stopCountDown();
}
}, 1000);
}
_stopCountDown () {
if (this.tickInterval) {
window.clearInterval(this.tickInterval);
}
}
}
customElements.define(MyCountDown.is, MyCountDown);
let MyCountDown = customElements.get('my-count-down');
let cd = new MyCountDown();
cd.time = 5;