我在Redux商店里有这个object
:
altaUsuario: {
//identificacion
identificacion : {
email: '',
username: '',
},
//Localización
localizacion : {
direccion: '',
cp: '',
provincia: '',
},
//Redes sociales
rdSocial : [
{
red:"",
name:""
},
],
假设我的表单上有三个步骤,每个步骤都会更新一个特定的部分,因此我将更新识别的操作称为更新本地化的其他操作,最后一个更新为rdSocial,(对于西班牙语变量,抱歉)。这里的重要部分是每个动作的有效负载,它是整个altaUsuario
对象的一部分,例如,这是我的一个动作:
{
type: 'ADD_ID_FIELDS',
payload: {
email: '',
username: 'josue',
}
}
现在,我的reducer从状态对象创建一个副本并更新altaUsuario属性,并更新我想要更新的对象的特定部分。 (听起来令人困惑)让我们看看我是怎么做到的:
case ADD_ID_FIELDS:
return { ...state, altaUsuario : {...state.altaUsuario, identificacion :action.payload }}
case ADD_LOCAL_FIELDS:
return { ...state, altaUsuario : {...state.altaUsuario, localizacion :action.payload }}
case ADD_RD_SOCIAL:
return { ...state, altaUsuario : { ...state.altaUsuario, rdSocial : action.payload}}
default:
那么,我怎样才能在一个动作中自动化这个过程?
这是我到目前为止所做的,但它不起作用:
case ADD_FIELD:
Object.keys(state.altaUsuario).map (cat => {
if(Object.keys(action.payload).some(r=> Object.keys(state.altaUsuario[cat]).includes(r))){
return { ...state, altaUsuario : {...state.altaUsuario, [cat] :action.payload }}
}
})
我的想法是在altaUsuario中使用我想要更新的特定属性进行搜索,但它不起作用。
这是一个好方法吗?
在当前的reducer中,操作ID(ADD_ID_FIELDS,ADD_LOCAL_FIELDS,ADD_RD_SOCIAL)确定要更新的字段(identify,localizacion,rdSocial)。
因此,为了使您接近工作,您需要在执行操作时传入要更新的参数。例如。作为行动的一部分。像这样的东西:
case "ADD_FIELD":
return { ...state, altaUsuario: {...state.altaUsuario, [action.fieldToUpdate]: action.payload }};
动作调用看起来像:
export const addField = (payload, id) => dispatch =>
dispatch({ type: ADD_FIELD, fieldToUpdate: id, payload })