Open ben196888 opened 7 years ago
A few quick idea of the technique we might use.
No ImmutableJs, Check this~! https://medium.com/@AlexFaunt/immutablejs-worth-the-price-66391b8742d4#.bt2x0nlsk Maybe we can use this. https://github.com/leoasis/redux-immutable-state-invariant
Let me show you a brilliant method to seperate the state logic part and view rendering part works. And you never ever worry about the immutable would interrupt ES6 styles.
We create selector function (or helper function as well) for the reducer. For example:
import { Map } from 'immutable';
import { getNextGoodId } from '../API';
const EMPTY_MAP = new Map();
const EMPTY_OBJECT = Object.create({});
export const getOwnerIdByGoodId = (state, goodId) => {
return state.get(goodId).getIn(['owner', 'id']).toJS() || EMPTY_OBJECT;
};
const goodReducer = (state = EMPTY_MAP, action) => {
switch (action.type) {
case 'ADD_GOOD': {
const goodId = getNextGoodId();
return state.set(goodId, action.good);
}
default:
return state;
}
};
export default goodReducer;
As a result, we could still get the state easily in container. Such as
import { connect } from 'react-redux';
import { getStore, getGoodById } from '../store';
import component from './component';
const mapStateToProps = (state, props) => {
const { goodId } = props;
const state = getStore().getState();
const ownerId = getOwnerIdByGoodId(state, goodId);
return {
ownerId,
}
};
export default container = connect(mapStateToProps)(component);
我們還有未來嗎?(眼神死