聚合物 2.5.0 - 重复不更新



我一直在寻找解决问题的方法,我遇到了这篇文章和这篇文章,但它并没有解决我的问题。

我想动态地将<li>添加到<ul>中,但是当我使用数组突变方法时,它不起作用(我可以正确记录数组的更新(。

我尝试使用JSON数组而不是简单的字符串,并尝试进行this.notifyPath('peoples');,但仍然不起作用

static get properties() {
return {
peoples: {
type: Array,
value: []
}
}
}
_test2() {
console.log(this.peoples);
}
_test() {
this.push('peoples', 'test');
}
<div class="flex__item--top list">
<ul id="namelist">
<template is="dom-repeat" items={{peoples}}>
<li>{{item}}</li>
</template>
</ul>
</div>

可以通过调用render方法强制dom-repeat重新呈现。

渲染((: void

强制元素呈现其内容。通常渲染为 与引发性变化异步。这样做是为了提高效率,所以 多个更改仅触发单个渲染。呈现方法 例如,如果需要模板呈现 验证应用程序状态。

所以如果你的dom-repeat是这样的

<template id="list" is="dom-repeat" items={{peoples}}>
<li>{{item}}</li>
</template>

您可以像这样强制从组件进行渲染

_test() {
this.push('peoples', 'test');
this.$.list.render();
}

最新更新