How to set multiple object values when using Immutable JS map

Question

I am new to redux, Is this correct way of doing redux in following code, please? This is a reducer method when action called to execute currentTime.

import { combineReducers } from 'redux';
import { UPDATE_TIME } from './actions';
import { Map } from 'immutable';

 const initialState = Map({update:false, currentTime: ""});

 function currentTime(state = initialState, action) {
  switch (action.type) {
    case UPDATE_TIME:
      return {...state, update: true, currentTime: action.time };
    default:
      return state;
  }
} 

const currentTimeReducer = combineReducers({
    currentTime
});

export default currentTimeReducer

Shubham Khatri · Accepted Answer · 2017-09-04 11:21:25Z

7

There are multiple ways to do it

You can set the value using set() function

  case UPDATE_TIME:
     state = state.set('update', true);
     return state.set('currentTime', action.time);

or even

 case UPDATE_TIME:
     return state.set('update', true)
                 .set('currentTime', action.time);

However this is not feasible when you have multiple changes

The other option is merge()

case UPDATE_TIME:
   return state.merge({update: true, currentTime: action.time})

However in case of a nested state update you would need to do a deepMerge. See the details of mergeDeep

answered Sep 4, 2017 at 11:21

Shubham Khatri

284k58 gold badges431 silver badges411 bronze badges

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

3 Comments

user2235768 Over a year ago

Thanks for your detailed answer, is there any chance could do it by reselect on state?

Shubham Khatri Over a year ago

What do you mean by reselect on state

Shubham Khatri Over a year ago

From what I understand, reselect is for having memoizable selectors,I am not sure, if it will be used to update the Immutable states in redux store

Narasimha Reddy - Geeker · Accepted Answer · 2017-09-04 11:25:08Z

We use immutable JS to create new instance on each small change in the existing object. Immutable JS MAP has a set method to set attribute and return new instance of the object. Here you can find api doc for MAP

import { combineReducers } from 'redux';
    import { UPDATE_TIME } from './actions';
    import { Map } from 'immutable';

     const initialState = Map({update:false, currentTime: ""});

     function currentTime(state = initialState, action) {
      switch (action.type) {
        case UPDATE_TIME:
            let newState = state;
            newState = newState.set('update', true );
            newState = newState.set('currentTime', action.time);
            return newState;
        default:
          return state;
      }
    } 

    const currentTimeReducer = combineReducers({
        currentTime
    });

    export default currentTimeReducer

Look best practices in this doc

Collectives™ on Stack Overflow

How to set multiple object values when using Immutable JS map

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related