Glimmer.js 如何在不使用構造函數的情況下將跟蹤屬性重置為初始值

Question

在 Glimmer.js 中，在不使用構造函數的情況下將跟蹤屬性重置為初始值的最佳方法是什么？

注意：不能使用構造函數，因為它只在初始頁面呈現時調用一次，並且在后續頁面點擊時不再調用。

Answer 1

這個答案有兩個部分，但它們之間的共同主題是它們強調從命令式樣式（在生命周期掛鈎中顯式設置值）到聲明式樣式（使用真正的單向數據流和/或使用裝飾器來實現）的切換清楚地表明您在哪里根據參數對本地狀態進行某種轉換）。

1. 你確定你需要這樣做嗎？ 很多時候人們認為他們這樣做了，他們實際上應該重組他們的數據流。 例如，許多的灰燼經典的時候，人們達到使用像鈎子“分叉”的數據的模式didInsertElement或didReceiveAttrs 。 在 Glimmer 組件中（無論是在 Ember Octane 中還是在獨立的 Glimmer.js 中），在數據所有者中簡單地管理您的更新是慣用的：真正執行 data-down-actions-up。

2. 有時，在組件中創建跟蹤數據的本地副本實際上是有意義的——例如，當您希望將來自 API 的數據與您在表單中處理數據的方式（因為用戶界面是 API界限！ ）。 在這些場景中，來自tracked-toolbox的@localCopy和@trackedReset裝飾器是很好的解決方案。

   • @localCopy大致按照其名稱進行操作。 它創建了通過參數傳入的數據的本地副本，您可以通過操作在本地更改它，但如果參數值更改，它也會切換回參數。

   • @trackedReset創建一些本地狀態，當參數更新時重置。 與@localCopy不同，狀態不是參數的副本，它只需要在參數更新時重置。

使用這兩種方法中的任何一種，你最終都會得到比舊的 Ember Classic 方法更“聲明性”的數據流：“分叉”數據是通過裝飾器完成的（方法 2），而且大部分時間你不會結束根本不會分叉它，因為您只是將更改推送回原始數據的所有者 (1)。