不可变的JS和Redux

Question

I am using redux with Immutable JS . My state is a Immutable JS object, something like

const initialState = Immutable.fromJS({
    bar: 1
    foo: {
        bar: 'a',
        foo: 'b',
        foobar: [
            {
               ...
        ...
    ...

Now I have the reducer and normally I would do

export function foo(state = initialState, action) {
    switch (action.type) {
        case FOO:
            return {
                ...state,
                foo: {
                    ...state.foo,
                    bar: action.value
                }
            };
        ...

But, now that I am using Immutable JS I need to do

export function foo(state = initialState, action) {
    switch (action.type) {
        case FOO:
            return {
                ...state, // do I need to change something here too?
                foo: {
                    ...state.get('foo'), // this changed
                    bar: action.value
                }
            };
        ...

However, that messes with my store. I loose everythng but bar: action.value . It seems like ...state.get('foo') does not equal to ...state.foo .

How do I do it properly? Or am I using Immutable JS wrong here?

Answer 1

You should be able to do just:

return state.set(['foo', 'bar'], value)

The array is the path in you object nested properties, the last one is the new value.