8.4 画面遷移・状態
8.4.1 状態遷移図
画面やコンポーネントの状態変化を図示する。
| 要素 | 記法 |
|---|---|
| 状態 | 角丸矩形 |
| 遷移 | 矢印 |
| イベント | 矢印上のラベル |
| 初期状態 | 黒丸から矢印 |
8.4.2 状態定義例
フォームの状態遷移例：
| 状態 | 説明 | 遷移条件 |
|---|---|---|
| 初期 | 未入力状態 | 画面表示時 |
| 入力中 | データ入力中 | フォーカス時 |
| 検証中 | バリデーション実行中 | 送信ボタン押下 |
| エラー | 検証エラー表示 | 検証失敗時 |
| 送信中 | API通信中 | 検証成功時 |
| 完了 | 処理完了 | API成功時 |
画面やコンポーネントの状態変化を図示する。
| 要素 | 記法 |
|---|---|
| 状態 | 角丸矩形 |
| 遷移 | 矢印 |
| イベント | 矢印上のラベル |
| 初期状態 | 黒丸から矢印 |
フォームの状態遷移例：
| 状態 | 説明 | 遷移条件 |
|---|---|---|
| 初期 | 未入力状態 | 画面表示時 |
| 入力中 | データ入力中 | フォーカス時 |
| 検証中 | バリデーション実行中 | 送信ボタン押下 |
| エラー | 検証エラー表示 | 検証失敗時 |
| 送信中 | API通信中 | 検証成功時 |
| 完了 | 処理完了 | API成功時 |