React Native redux reducers best way to push array

Question

I have the following state and reducer but it's not pushing in the new array object.

const initialState = {
    photos: [],
    selectedPhoto:{},
    photosTeamId:'',
    photosProjectId:''
};

case actionTypes.PHOTOS_UPDATE:
            return Object.assign({}, state, {
                photos:action.data.photos,
                photosTeamId:action.data.photosTeamId,
                photosProjectId:action.data.photosProjectId
            })

photos is not getting pushed but overwritten

See this stackoverflow.com/questions/43376849/… and this stackoverflow.com/questions/41949387/…. You can either go with Spread operator syntax or Immutability-helper package — Shubham Khatri
– Shubham Khatri, Commented Nov 2, 2017 at 8:12

Shubhnik Singh · Accepted Answer · 2017-11-02 06:53:01Z

2

Here's a more cleaner way using javascript spread syntax:

const initialState = {
    photos: [],
    selectedPhoto:{},
    photosTeamId:'',
    photosProjectId:''
};

case actionTypes.PHOTOS_UPDATE:
            return {
                ...state,
                photos: [...state.photos, ...actions.data.photos],
                photosTeamId: action.data.photosTeamId,
                photosProjectId: action.data.photosProjectId
            }

answered Nov 2, 2017 at 6:53

Shubhnik Singh

1,32911 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

vinayr · Accepted Answer · 2017-11-02 06:35:21Z

0

case actionTypes.PHOTOS_UPDATE:
  return {
    ...state,
    photos: state.photos.concat(action.data.photos),
    photosTeamId: action.data.photosTeamId,
    photosProjectId: action.data.photosProjectId
  };

answered Nov 2, 2017 at 6:35

vinayr

11.3k3 gold badges49 silver badges44 bronze badges

Comments

vikram jeet singh · Accepted Answer · 2017-11-02 06:43:47Z

0

Here's the spread operator […]. The spread operator can be used to take an existing array and add another element to it while still preserving the original array.

Example:

case actionTypes.PHOTOS_UPDATE:
  return [
    ...state,
    Object.assign({}, {
      photos:action.data.photos,
      photosTeamId:action.data.photosTeamId,
      photosProjectId:action.data.photosProjectId
    })
  ];

answered Nov 2, 2017 at 6:43

vikram jeet singh

3,5262 gold badges24 silver badges22 bronze badges

Collectives™ on Stack Overflow

React Native redux reducers best way to push array

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related