首页 > 解决方案 > Redux 重置操作 - 状态相等

问题描述

对于 React Redux,我有以下初始状态:

const inistialStateRedux = {
  configuredFilters: {
    data: {
      countries: [],
      divisions: [],
      companies: [],
      locations: [],
      fields: [],
      search: '',
    },
  },
};

现在我想创建一个 RESET 减速器。

它看起来像这样:

export const createReducer = (initialState, handlers) => (
  state = initialState,
  action
) => {
  if (action.type in handlers) {
    return handlers[action.type](state, action);
  }
  return state;
};

export const multiUse = (reducer, name = '') => (state = null, action) => {
  if (action.name !== name) return state;

  return reducer(state, action);
};

import {
  createReducer
} from '../helper';
import * as Action from './actions';
import inistialStateRedux from '../inistialStateRedux';

export default createReducer({
  data: {},
}, {
  [Action.RESET_CONFIGURED_FILTERS]: (state) => ({
    ...state,
    data: {
      ...inistialStateRedux.configuredFilters.data,
    },
  }),
});

但 Redux Devtools 显示,状态是平等的。我究竟做错了什么 ?

标签: javascriptreactjsreducers

解决方案


在 Actions 中,您可以使用调度程序来重置表单。像这样:

import axios from 'axios';
import { ADD} from '../modelType';
import { reset } from 'redux-form'; 


export const add= formValues => async dispatch => {
  const res = await axios.post('/api/model/', { ...formValues });
  dispatch({
    type: ADD,
    payload: res.data
  });
  dispatch(reset('yourUniqueFormName'));
};

推荐阅读