只需使用action creators，redux和thunk将对象添加到空数组

Question

我想简单地将新的“客户端”添加到位于clientReducer中的空clientList。我可以看到一切都工作清楚，因为当我在clientReducer中调试console.log（状态）时，我可以看到来自输入的信息已经通过调度，动作创建者，现在在reducer中。我的问题是这里的一大块代码......我正在努力不断将客户端添加到我的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