Question

所以我想创建一个通用动作创建器来管理redux商店中的项目。

假设我的redux商店看起来像这样：

one: '',
two: '',
three: ''

我的动作创作者看起来像这样：

export const setStatus = (name, status) =>{
    return function(dispatch){
        dispatch({
            type: 'SET_STATUS',
            name,
            status
        })
    }
}

我不知道如何创建一个可以管理所有内容的操作。试图

case 'SET_STATUS':{
            return{
                ...state,
                action.name: action.status 
            }
        }

但是redux不会让我。有没有解决方法？

Answer 1

您应该使用bracket notation将变量用作键：

case 'SET_STATUS':{
    return{
        ...state,
        [action.name]: action.status 
    }
}

Answer 2

认为代码对你有用。因为你可以改变你想要的一些数据。祝你好运

import { createStore } from 'redux'; 

const reducer = (state={
  one: '',
  two: '',
  three: ''
} , action)=>{
switch(action.type){
    case "SET_STATUS":
        state = {
            ...state,
            one: action.payload.one,
            two: action.payload.two,
            three: action.payload.three
        }
    break;
    default: break;
 }
 return state;
}


const store = createStore(reducer);

store.subscribe(()=>{
    console.log(store.getState());
});
const data = {
  one: 'value of one',
  two: 'value of two',
  three: 'value of three'
}
store.dispatch({ 
  type:"SET_STATUS",
  payload: data
});

一个redux动作来管理多个项目

2 个答案: