[Javascript] 狀態管理: XState

日期：

xstate web

XState 簡介
https://blog.jerry-hong.com/posts/xstate-introduction/

XState Usage with Vue
https://xstate.js.org/docs/recipes/vue.html#usage-with-vue

vue-xstate
https://github.com/asbermudez/vue-xstate/blob/master/README.md

xstate vue demo
https://codepen.io/BrockReece/pen/EvdwpJ

實現一個簡單的 JavaScript 狀態機[每日前端夜話0xBF]
https://cloud.tencent.com/developer/article/1507751

【第2497期】降低前端業務複雜度新視角：狀態機範式

XState 是一個Javascript所撰寫的狀態管理套件，負責儲存及描述各種狀態與各種狀態間的轉換。當我們在開發前端網頁時，通過靜態圖像轉換為代碼，我們失去了對應用程式的高度理解，而 隨著應用程式的不斷變大，理解哪個代碼段負責哪部分的介面變得越來越困難。不是所有的問題都可以用單純用介面來回答，當用戶重複點擊按鈕時會發生什麼？如果用戶想要在運行中取消請求，該怎麼辦？事件分散在我們的代碼中，並具有不可預知的影響；而且，當用戶點擊一個按鈕時，究竟發生了什麼？我們需要更好的抽象，幫助我們理解射擊事件的影響。當我們真的進行貨真價實的UX設計時，大量的isFetching，isShowing，isDisabled變量是非常普遍的，尤其是我們需要跟蹤改變UI的一切。XState通過StateCharts提供嚴格的應用程式列為視覺形式，可幫助我們解決這些問題，用繪製狀態圖讓我們可以對我們的應用程式有一個高度的理解，讓我們用視覺線索回答問題。


#Javascript, XState, state, StateCharts, chart, UX, 狀態, 管理, 轉換, 設計, 視覺

留言

張貼留言