Vuex的mutation中不能做異步操作的原因是因為mutation必須是同步函數。這是因為Vuex的設計原則是通過mutation來改變狀態,而狀態改變后,視圖會立即更新。如果mutation中是異步操作,那么當狀態改變時,視圖可能還沒有更新完成,這會導致視圖和狀態不一致的情況。
另外,如果mutation中進行異步操作,那么就無法保證狀態的改變是按照預期的順序執行的,這可能會導致一些難以預料的問題。
如果需要進行異步操作,可以在action中進行。action可以包含任意異步操作,當異步操作完成后,再通過調用mutation來改變狀態。這樣可以保證狀態的改變是按照預期的順序執行的,同時也保證了視圖和狀態的一致性。
除了保證狀態改變的一致性和可預測性,Vuex要求mutation必須是同步函數還有另一個重要的原因,那就是為了確保devtools中的時間旅行功能可以正常使用。
當你在開發過程中使用Vuex,你可能會使用Vue Devtools插件來幫助調試你的應用。這個插件有一個非常有用的特性,那就是時間旅行。你可以記錄應用的狀態改變,然后隨時回滾到某個特定的狀態。
但是,這個特性只適用于同步的mutation。如果mutation是異步的,那么當狀態改變時,devtools可能無法準確地捕獲到這個改變,因此也就無法進行時間旅行。
所以,總的來說,Vuex要求mutation必須是同步函數是為了保證狀態改變的一致性和可預測性,以及確保devtools中的時間旅行功能可以正常使用。如果你需要進行異步操作,那么應該使用action來進行。