React Redux 无法将对象插入嵌套数组

Question

我正在尝试将对象插入特定对象（即对象列表）。下面是代码。

import MESSAGES from '../actions/Messages';
import update from 'immutability-helper';

const chatReducer = (state = [], { type, payload }) => {
    switch (type) {
        case CHATS:
            // state = [...state, payload];
            // return state;
            return state, payload;
        case MESSAGES:
            let index = state.findIndex(
                chat =>  chat.chatId === payload.chatId);
            const conn = state[index];
            const messages = [...conn.messages, payload];
            const newState = state.slice();
            newState[index] = { ...conn, messages };
            //console.log("ne ", newState)
            return newState;
        default:
            return state
    };
};

export default chatReducer;

这里只是根据 id 查找对象并将有效负载插入无效的消息数组。

Answer 1

您必须完成 2 次检查

如果索引为-1（未找到聊天ID）：添加新的聊天对象
不要做 slice 它只会 return 其余的项目和索引会不匹配

    const chatReducer = (state = [], { type, payload }) => {
      switch (type) {
        case CHATS:
          // state = [...state, payload];
          // return state;
          return [...state, ...payload];
        case MESSAGES:
          let index = state.findIndex((chat) => chat.chatId === payload.chatId);
    
          if (index !== -1) {
            const conn = state[index];
            const messages = [...conn.messages, payload];
            const newState = [...state]; // use destructuring instead of slice
            newState[index] = { ...conn, messages };
            return newState;
          }
          return [
            ...state,
            /* <add new chat object> */
          ]; // Do something if the chat doesn't exist
        default:
          return state;
      }
    };

Answer 2

我会回答我自己的问题，谢谢@Rahul Sharma 你刚刚重定向了我。由于我的应用程序要求，我更改了对象。

import CHATS from '../actions/ChatMessages';
import MESSAGES from '../actions/Messages';
import SEARCH from '../actions/SearchUser';

const chatReducer = (state = {}, { type, payload }) => {
    switch (type) {
        case CHATS:
            return { ...state, payload };
        case MESSAGES:
            let index = state.payload.chats.findIndex(
                chat => chat.chatId === payload.chatId
            );
            let conn = state.payload.chats[index];
            const msg = payload.msg;
            conn.lastMsg = msg;
            const messages = [...conn.messages, payload];
            const newState = { ...state };
            newState.payload.chats[index] = { ...conn, messages };
            console.log("state ", newState);
            return newState;
        default:
            return state
    };
};

export default chatReducer;

React Redux 无法将对象插入嵌套数组

React Redux not able to insert an object into nested array

reactjs

redux

react-redux