我是reactjs和创建小项目的新手,我使用的是功能组件而不是类组件,并使用store for state。我添加了一些状态变量,并希望在退出状态下添加对象数组,我试过但它不起作用。下面是我的商店文件,其中设置状态:
export const initialState = {
validationTally: 0,
token: '',
multiForm : []
}
// action types
const SET_VALIDATION_TALLY = 'SET_VALIDATION_TALLY';
const SET_TOKEN = 'SET_TOKEN';
const SET_MULTIFORM = 'SET_MULTIFORM';
export const reducer = (state, action) => {
switch (action.type) {
case SET_VALIDATION_TALLY:
return {
...state,
validationTally: state.validationTally + 1
};
case SET_TOKEN:
return {
...state,
token: action.payload
};
case SET_MULTIFORM:
return {
...state,
multiForm: action.payload
};
}
}
export const setValidationTally = () => ({
type: SET_VALIDATION_TALLY
});
export const setToken = payload => ({
type: SET_TOKEN,
payload
});
export const setMultiForm = payload => ({
type: SET_MULTIFORM,
payload
});
我想动态地在状态变量“multiForm”中添加对象,当有人输入值2时我想在“multiForm”中添加两个对象,如下所示
export const initialState = {
validationTally: 0,
app: '',
token: '',
multiForm : [{
firstName : '',
lastName :''
},
{
firstName : '',
lastName :''
}]
}
假设用于action.payload
动作的SET_MULTIFORM
包含要添加的字段数,您可以简单地映射数组项并添加到现有字段
case SET_MULTIFORM:
return {
...state,
multiForm: [...state.multiForm, ...Array.from({ length: action.payload }).map(() => ({firstName: '', lastName: ''}))]
};