Nicholas Haley Nicholas Haley - 10 months ago 93
React JSX Question

Immutable JS - How to replace a list with a new list

I have a React + Redux app which uses Immutability.js. In my reducer I have state defined as an Immutable List

const initialSuggestedResponseState = Immutable.List([]);

Every time a specific action happens, I would like to replace this list with a new list. I think I am missing something with Immutability.js as I have not been able to figure out a working solution. So far I have tried things like this:

action.messages.forEach(message => {
let newResponse = new suggestedResponseRecord({
body: message.body,
responseId: message.response_id,
type: message.type
return state;

This however does not push anything to my list. Why does this not work, and what is the appropriate methodology? I'm sure there is something MUCH simpler.

Thanks in advance :)

Answer Source

Doing state.push on any sort of immutable object returns a new object. The existing state is not modified, which is why returning the state after pushing to it doesn't work. A quick hack would be to change state.push(newResponse); to state = state.push(newResponse);. I suggest you read up more on how immutable structures work :)