在Vue中管理演示數據（調整事件大小）？

Question

我正在工作一個Vue項目，並且我正在使用Vuex來管理應用程序狀態。我已經將應用程序的視圖分離爲許多小布局，如Vue組件。例如，我有一個header和浮動stats面板的佈局。

我寫了一個自定義指令來粘貼stats面板。目前，這與Bootstrap類似，您可以在其中設置值，並且當頁面滾動超過該點時，將向該元素添加一個affix CSS類。該值基於header的高度。由於應用程序是響應式的，我寧願從頭部outerHeight屬性計算出此值。現在

，我能想到的就如何做到這一點幾種方法，但是我不知道正確的Vue公司辦法做到這一點。

1. 我可以偵聽調整大小事件，並讓頭更新它在Vuex商店中的高度。但是，讓商店管理演示數據似乎是一種不好的做法。
2. 我可以將標頭的id傳遞給詞綴指令，並使用getElementById來檢查高度。但是這完全繞過了Vue。
3. 我可以添加一個方法到header來返回它的高度，並讓父組件保持header和stats面板都使用它來更新附加值。但是，如果header和stats不共享相同的父級，則會變得很混亂。

還有其他的選擇嗎？最佳做法是什麼？謝謝！

Answer 1

我一定會去＃1 - 通過Vuex分享。請記住，Vuex只是一個舞臺管理員。沒有規則要存儲什麼樣的數據。此外，我認爲最好使用它，因爲更多的組件可能依賴於這種數據，並且它將是唯一的真相來源，並且以可預測的方式進行變異。所有其他選項都包括耦合頁面上的組件/實例/元素，因此高度和頁面之間的連接越大，這些連接的增長就越複雜。

此外，它會被動，因此只需使用動作/變化，您就可以隨時更新動作/變化，因此您的網頁看起來反應靈敏。