1. Extended State 前面學習到的 FSM ,我們透過枚舉、列舉 (Enumerate),一個狀態機內所有可能的狀態,狀態機被提供的狀態是有限(F...
問題延伸 1. 請問如何動態載入不同的 context ? 比如說我們這台狀態機想要給許多不同的店家共用,比如「綠洲酒吧」、「蘋果旗艦店」... 難道我需要一直...
還記得我們在 Day 13 的例子嗎? 有個 Input 的 UI 元件,且它有以下 [Invalid / Valid]、[Disabled / Enabled...
還記得我們在 Day 14 的例子嗎? 這是一個比較符合現實情境的 Input 元件狀態,只有當 input content 有改變時, valid / i...
還記得我們在 Day 15 曾經介紹過 Guard 嗎? 今天要來跟大家分享如何在 XState 中使用 Guard 保護狀態轉移 const someMach...
還記得在 Day 15 馬克杯 裝水 Guard 的例子嗎? 另外一組例子,一個水瓶或是馬克杯的狀態一開始是『空的』,有「裝水」這個事件,每次要裝水時,都會當...
先前我們介紹過了階層式狀態,讓我們能將一個狀態向下描述得更精確,比如以之前的 input 元件狀態機當 input 是 changed 時,可以更向下描述,這個...
前面介紹許多 State Machine 及 XState 的功能,由於篇幅不多了,今天想跟大家先快速的介紹一下在 React 中如何使用 XState。 快速...
1. XState as Global State in React 在 React 提到 Global State 時,大家很常會想到 React conte...
說到學習資源,最容易學習的方式就是從母語開始 中文文章 Jerry Hong 的部落格Jerry 在前端社群相當樂於分享,也是之前鐵人賽的冠軍,其文筆及範例、說...