使用不可變的

Immutable 是一個很棒的庫,它為我們提供了廣泛使用的集合型別的不可變版本,例如列表,堆疊,地圖等。

它簡化了對狀態的操作,使得更容易進行純計算並避免突變。

讓我們看看如何使用 Immutable 的 Map 和 List 結構重寫 Basic reducer:

import { ACTION_ERROR, ACTION_ENTITIES_LOADED, ACTION_ENTITY_CREATED } from './actions';

// Import Immutable
import Immutable from 'immutable';

// Set up a default state using a Map, a structure very similar to objects
// Note that states in Redux can be anything, not just objects
const initialState = Immutable.Map({
    error: undefined,
    entities: Immutable.List()
});

export default (state = initialState, action) => {

    switch(action.type) {

        case ACTION_ERROR:
            return state.set('error', action.error);

        case ACTION_ENTITIES_LOADED:
            return state.merge({
                entities: Immutable.List(action.entities)
                error: undefined
            });
        
        case ACTION_ENTITY_CREATED:
            return state.set('entities', state.entities.push(action.entity));

        default:
            return state;
    }
};

正如你可能已經看到的,使用 Immutable 可以更輕鬆地處理不可變狀態。