卸載聚合物頁面

Question

我一直在使用POCing聚合物與Redux和Polymer（2.0）入門工具包結合使用，其中介紹了iron-pages組件，以及其中包含的頁面的延遲加載。

但是，我注意到它們實際上不是頁面，而更像是一個老式的tab bar，其中所有內容都被加載到DOM中，但是使用CSS隱藏。調用connectedCallback()生命週期方法，但disconnectedCallback()不是因爲組件從未卸載。

這感覺就像一個內存和性能泄漏給我。我們將要實現的一個用例是通過websockets進行的頻繁更新的數據;我想避免的是它在後臺更新。對於桌面，我認爲它會很好，但對於移動設備來說，它對性能來說會很糟糕。

其次，我寧願不必實施手動生命週期管理; NIH的氣味。

因此，它歸結爲：聚合物和/或分頁Web組件中是否存在組件卸載或可靠的生命週期回調？

編輯：我看到Unloading Polymer pages也有同樣的問題 - 雖然沒有答案。

編輯2：我看到在iron-pages上也出現了這個問題。

Answer 1

如相關問題所述，您可以使用條件模板（<template is="dom-if">）和restamp屬性。使用restamp時，條件爲false時將刪除元素，因此您的disconnectedCallback被調用。您可以使用一組dom-if模板來代替iron-pages元素。

正如您所指出的那樣，iron-pages元素更像是一個標籤面板，並且在底層視圖相對較輕時您運行良好，或者您希望人們頻繁地來回切換，並且不想支付重新創建的代價他們。但是，在很多情況下，當元素佔用大量內存或者（在你的情況下）只要他們在頁面上工作的時候，一個條件模板就是要走的路。