React-使用imutable.js来管理store中的数据

reducer.js中store的数据是不能改变的，用原始的方法要手动的保证store不被修改，存在风险。imutable.js可以生成一个不可改变的对象，可以避免掉自己不小心修改掉store的情况。

1.安装

npm install immutable --save

2.reducer.js中导入immutable，fromJS方法可以把一个普通对象变成不可变对象。修改数据时用set方法。

import * as actionTypes from './actionTypes';

import{ fromJS } from 'immutable'

/*fromJS方法可以把一个普通对象变成不可变对象*/

const defaultState=fromJS({

    focused:false

})

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

    if(action.type==actionTypes.SEARCH_FOCUS){

        //immutable对象的set方法，会结合之前的immutable对象的值和设置的值，返回一个全新的对象，不是修改对象的值

        return state.set('focused',true)

    }

    if(action.type==actionTypes.SEARCH_BLUR){

        return state.set('focused',false)

    }

    return state;

}

3.组件中获取数据时，用get方法。

const mapStateToProps = (state) => {

    //focused是immutable对象，不能用state.header.focused的形式获取，要用get()

      return  {

          focused:state.header.get('focused')

      }

}

巴特西

React-使用imutable.js来管理store中的数据

最新文章

热门文章