对于这种情况,我正在尝试向存储所有任务的数组中添加一个新的TaskState
,其键为TaskID
,值为TaskState
。我不确定如何在减速器中表达这一点。另外,我不确定我的ThunkActions是否正确,但请暂时保留。
reducer.ts
export interface TaskState {
taskID: string;
site: string;
input: string;
inputType: InputTypeEnum;
useAccount: boolean;
profile: string;
accountUser: string;
accountPassword: string;
taskStatus: TaskStatusEnum;
}
export interface TasksState {
[taskID: string]: TaskState;
}
const defaultState: TasksState = {}; // I don't have to do anything here?
export const tasksReducer: Reducer<TasksState> = (state = defaultState, action: TasksAction) => {
switch (action.type) {
case ADD_TASK:
return {
...state,
action.taskID: ... // not sure about this one.
};
case DELETE_TASK:
return {
...state,
// need to delete a TaskState object that corresponds to a certain TaskID
};
default:
return state;
}
};
actions.ts
export const ADD_TASK = 'ADD_TASK';
export const DELETE_TASK = 'DELETE_TASK';
export interface TaskActionAdd extends Action {
type: 'ADD_TASK';
payload: TaskState;
}
export interface TaskActionDelete extends Action {
type: 'DELETE_TASK';
taskID: string;
}
export const addTask: ActionCreator<
ThunkAction<
Promise<TaskActionAdd>,
TasksState,
TaskState,
TaskActionAdd
>
> = (task: TaskState) => {
return async (dispatch: Dispatch) => {
const addTaskAction: TaskActionAdd = {
type: ADD_TASK,
payload: task,
}
return dispatch(addTaskAction);
}
}
export const deleteTask: ActionCreator<
ThunkAction<
Promise<TaskActionDelete>,
TasksState,
TaskState,
TaskActionDelete
>
> = (taskID: string) => {
return async (dispatch: Dispatch) => {
const deleteTaskAction: TaskActionDelete = {
type: DELETE_TASK,
taskID,
}
return dispatch(deleteTaskAction);
}
}
export type TasksAction = TaskActionAdd | TaskActionDelete;