安裝

此專案需要安裝 Redux Toolkit 和 React-Redux:

npm install @reduxjs/toolkit react-redux

專案結構

由於 Redux 需要多個檔案(store, slice, components),此專案將所有程式碼放在單一檔案中方便學習。

實際專案中應拆分為:

src/
├── app/
│   └── store.js           # Store 設定
├── features/
│   └── todos/
│       ├── todosSlice.js   # Slice 定義
│       └── TodoList.jsx    # 元件
└── App.jsx

使用方式

Project_ReduxTodo.jsx 的內容複製到你的 App.jsx 中。

專案功能

  • 使用 createSlice 管理 Todo 狀態
  • CRUD 操作(新增、讀取、更新、刪除)
  • 過濾功能(全部、未完成、已完成)
  • 計數與統計
  • 使用 useSelector 和 useDispatch