在使用redux时,组件派发出action,在reducer中处理时,我需要返回一个处理后的新的对象,也就是说不能对state进行直接的修改。immutable的作用就是,将state设置为不可变对象。以下是实现步骤。
按照依赖
npm install immutable
store文件夹下reducer.js
import { fromJS } from 'immutable';
// 将state设置为不可变对象
const defaultState = fromJS({
focused: false,
mouseIn: false,
list: [],
page: 1,
totalPage: 1
});
export default (state = defaultState, action) => {
switch (action.type) {
case constants.SEARCH_FOCUS:
// immutable.js对象的set方法,会结合之前immutable对象的值和设置的值,返回一个全新的对象
return state.set('focused', true);
default:
return state;
}
}
在组件中的使用
const mapStateToProps = (state) => {
return {
focused: state.get('focused'),
}
}