Creating Global State for the App
Desliza para mostrar el menú
Create the file:
src/features/tasks/tasksSlice.js
Add the initial slice:
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;
Now connect it to the store:
import { configureStore } from '@reduxjs/toolkit';
import tasksReducer from '../features/tasks/tasksSlice';
export const store = configureStore({
reducer: {
tasks: tasksReducer
}
});
You created a slice to manage tasks and connected it to the store. The application now has a central place where all task data lives and can be updated.
¿Todo estuvo claro?
¡Gracias por tus comentarios!
Sección 7. Capítulo 2
Pregunte a AI
Pregunte a AI
Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla
Sección 7. Capítulo 2