Question

我只想向我的clientReducer中的空clientList添加一个新的“ client”。我可以看到一切工作正常，因为当我在clientReducer中使用console.log（state）时，我可以看到来自输入的信息已经通过调度，动作创建者进行了处理，并且现在位于化简器中。我的问题是这里的这段代码...我试图继续将客户添加到我的redux存储中。

我尝试使用this.setState（{}），但无法读取。

这是clientActions：

export const addClient = (client) => {
    return(dispatch, getState) => {
        dispatch({type: 'ADD CLIENT', client})
    }
}

这是clientReducer：

const initState = {
    clientList: []
}

const clientReducer = (state = initState, action) => {
    switch (action.type) {

        case 'ADD CLIENT' : 
            let clientList =  [...state.clientList, action.client];
            this.setState({
              clientList : clientList
            })
            return state;

        default : return state;
    }
}    

export default clientReducer

Answer 1

您不必在reducer内执行setState，而只需返回更新后的状态即可。

const clientReducer = (state = initState, action) => {
    switch (action.type) {

        case 'ADD CLIENT' : 
            let clientList =  [...state.clientList, action.client];
            return {
              ...state,
              clientList : clientList
            }

        default : return state;
    }
}    

export default clientReducer

只需使用动作创建者，redux和thunk将对象添加到空数组中

1 个答案: