How to add a number to an existing array in redux react

Question

I want to update Array

initialState

const initialState = { name:'a', arrNames:[1,2,3,4]}

reducer

const userRuducer = createReducer(initialState,(builder)=>{   
    
    builder.addCase('UPDATE_ARRAY',(state,action)=>{
        // how to add ' 12' in the arraay
    })
})

component

 <Button onClick={() =>dispatch({type:'UPDATE_ARRAY',payload:12}) } variant='contained'>update Array</Button>

result:-

arrNames:[1,2,3,4, 12]

https://redux-toolkit.js.org/api/createreducer – Nicolas Castellanos Sep 15 '21 at 12:09 — Nicolas Castellanos, Sep 15 '21 at 12:09

score 1 · Answer 1 · answered Sep 15 '21 at 12:09

1

You are using redux-toolkits so it basically just push the new item to the object:

builder.addCase("UPDATE_ARRAY", (state, action) => {
  state.arrNames.push(action.payload)
};

Because redux-toolkits already included with immerjs

answered Sep 15 '21 at 12:09

Ryan Le

7,708
1
13
23

score 0 · Answer 2 · answered Sep 15 '21 at 13:07

0

builder.addCase("UPDATE_ARRAY", (state, action) => {
  return {
    ...state,
    arrNames:[...state.arrNames,action.payload]
  };
})

here the state is immutable and conceded as better practice

answered Sep 15 '21 at 13:07

Rishab Vaigankar

443
3
8

How to add a number to an existing array in redux react

2 Answers2