アプリのためのグローバルステートの作成
メニューを表示するにはスワイプしてください
ファイルを作成:
src/features/tasks/tasksSlice.js
初期スライスを追加:
import { createSlice } from '@reduxjs/toolkit';
const initialState = {
items: []
};
const tasksSlice = createSlice({
name: 'tasks',
initialState,
reducers: {
addTask(state, action) {
state.items.push(action.payload);
},
toggleTask(state, action) {
const task = state.items.find((task) => task.id === action.payload);
if (task) {
task.completed = !task.completed;
}
},
deleteTask(state, action) {
state.items = state.items.filter((task) => task.id !== action.payload);
}
}
});
export const { addTask, toggleTask, deleteTask } = tasksSlice.actions;
export default tasksSlice.reducer;
次に、ストアへ接続:
import { configureStore } from '@reduxjs/toolkit';
import tasksReducer from '../features/tasks/tasksSlice';
export const store = configureStore({
reducer: {
tasks: tasksReducer
}
});
タスクを管理するためのスライスを作成し、ストアに接続。アプリケーション全体でタスクデータを一元管理・更新可能な状態。
すべて明確でしたか?
フィードバックありがとうございます!
セクション 7. 章 2
AIに質問する
AIに質問する
何でも質問するか、提案された質問の1つを試してチャットを始めてください
セクション 7. 章 2