Redux is simple
Tue Apr 19 2022 12:10:02 GMT+0000 (Coordinated Universal Time)
Saved by
@mouadh
#react.js
/* Redux is a state management library
1 Create Initial State
2 Define Action Types
3 Define Action Creators
4 Create Reducers
5 Change the initial State
6 Pass the parameters to the Creator function and the reducers */
Code
// Initial State
const initialState = {
todos: [
{
text: "eat food",
},
{
text: "Exercise",
},
],
};
// Action Types
// create a simple action type
const ADD_TODO = "ADD_TODO";
// ACtion creators
function addTodo(text) {
return {
type: ADD_TODO,
payload: text,
};
}
//create reducers
function todoReducer(state = [], action) {
switch (action.type) {
case ADD_TODO:
return [...state.todos, { text: action.payload }];
default:
return state;
}
}
console.log("Initial State : ", initialState);
// Lets make changes to initial states
const action = addTodo("Make it work");
const newState = todoReducer(initialState, action);
console.log(newState);
content_copyCOPY
https://www.codegrepper.com/profile/ketan
Comments