聚合物2.5.0-dom-repeat不更新

Question

我一直在尋找SO解決我的問題的方法，我偶然發現了這篇文章和另一篇文章，但並不能解決我的問題。

我想動態地將<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> 

Answer 1

您可以通過調用render方法來強制重新進行dom-repeat 。

render（）：無效

強制元素呈現其內容。 通常，渲染與令人發指的更改異步。 這樣做是為了提高效率，以便多個更改僅觸發一個渲染。 例如，如果需要模板渲染來驗證應用程序狀態，則應調用render方法。

所以如果你的dom-repeat是這樣的

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

您可以像這樣從組件強制渲染

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