javascript - 在两个 Redux Reducers/State 之间共享数据

标签 javascript redux

对于两个状态/reducer 之间的数据共享,这是一个合理的解决方案吗?

//combineReducers
function coreReducer(state = {}, action){

    let filtersState = filters(state.filters, action);
    let eventsState = events(state.events, action, { filters: filtersState});

    return { events: eventsState, filters : filtersState};

}

export const rootReducer = combineReducers(
    {
        core  : coreReducer,
        users
    }
);

如果是这样,如果两者都响应同一个分派(dispatch)事件并且第二个归约函数取决于第一个归约函数的新状态,那么如何保证缩减函数的执行顺序?

假设我们发送了一个 SET_FILTER 事件,该事件附加到过滤器存储中的 activeFilters 集合,随后根据 activeFilters 值更改事件存储中项目的可见性。

//ActiveFilters reducer
function filtersActions(state = {}, action){

    switch (action.type) {
        case SET_FILTER:
            return Object.assign({}, state, {
                [action.filterType]: action.filter
            })
        case REMOVE_FILTER:
            var temp = Object.assign({}, state);
            delete temp[action.filterType];
            return temp;

        case REMOVE_ALL_FILTERS:
            return {};

        default:
            return state
    }
}

我想我找到了答案 - 计算派生数据 - 重新选择

http://redux.js.org/docs/recipes/ComputingDerivedData.html

最佳答案

/--------container--------/
import {getGroupsAndMembers} from '../reducers'
const mapStateToProps = (state) => {
  return {
    inputValue: state.router.location.pathname.substring(1),
    initialState: getGroupsAndMembers(state) <-- this one
 }
}


/--------reducers--------/
export function getGroupsAndMembers(state){
   let { groups, members } = JSON.parse(state)
   response = {groups, members}
   return response;
}


GroupsContainer.propTypes = {
 //React Redux injection
 pushState: PropTypes.func.isRequired,
 // Injected by React Router
 children: PropTypes.node,
 initialState:PropTypes.object,
}

不要忘记遵循“连接”的准则

export default connect(mapStateToProps,{ pushState })(GroupsContainer)

关于javascript - 在两个 Redux Reducers/State 之间共享数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34711512/

相关文章:

javascript - 如何选择包含特定单词的 postgreSQL 行

javascript - 如何从两个不同的 JS 文件中获取具有相同名称的变量的每个值?

reactjs - 无法读取 Redux thunk 操作上未定义的属性 'then'

redux - NGRX 效果中的多个操作

javascript - 无法创建新记录

javascript - 如何使用 browserify 创建的包文件?

javascript - 在不刷新页面的情况下加载另一个子域

reactjs - 我们如何在 React 中以功能性的方式发送/闪烁通知/警报?需要有一个通用的功能,可以到处使用

javascript - React Redux 连接函数中的 Typescript 错误

reactjs - react Redux : Cannot read property 'dispatch' of undefined