Kami memiliki beberapa daftar tugas. Kami memiliki jenis initialState seperti ...

initialState = [   {
  id: 0,
  title: "first",
  items: [
    {
      title: "one from first",
      id: 0,
      cards: [
        {
          id: 0,
          text: "111",
        },
        {
          id: 1,
          text: "222",
        },
      ],
    },
    {
      title: "two from first",
      id: 1,
      cards: [
        {
          id: 0,
          text: "www",
        },
        {
          id: 1,
          text: "zzz",
        },
      ],
    },
  ],   },   {
    id: 1,
    title: "second board",
    items: [
      {
        title: "first from second",
        id: 0,
        cards: [
          {
            id: 0,
            text: "asd",
          },
          {
            id: 1,
            text: "fasdf",
          },
        ],
      },
    ],   }, ];

Kami tidak akan menormalkan keadaan ini karena beberapa alasan. Saya harus menambahkan Daftar baru. Peredam di sini:

switch(action) {
  case CONSTANTS.ADD_LIST:
    const newList = {
      title: action.payload.title,
      cards: [],
      id: listID,
    };
    listID += 1;

    return {
      ...state,
      [action.payload.boardID]: {
        ...state[action.payload.boardID],
        items: [...state[action.payload.boardID].items, newList],
      },
    };
}

Contoh. Saya ingin menambahkan newList untuk item dari papan 1 (mulai dari 0).

Saya menguji contoh lain seperti di atas dan itu tidak berguna.

Jadi saya tidak mengerti mengapa itu tidak berhasil. Saya pikir saya memiliki beberapa masalah dengan docs redux dan saya tidak bisa mendapatkannya.

Terima kasih!

2
Paul Strutinsky 20 November 2020, 12:08

1 menjawab

Jawaban Terbaik

InitialState Anda tampaknya merupakan Array dan bukan objek:

initialState = [ {Board1},{Board2} ]

Tapi peredam Anda sepertinya mengembalikan objek, jadi mungkin itu masalah potensial.

======

Anda dapat mencoba perubahan berikut di peredam Anda:

  • buat salinan dangkal dari boardsArr alias initialState
  • lingkari setiap papan dan buat objek papan baru
  • Lingkari prop items setiap objek papan, dan buat salinannya yang dangkal
  • lingkari prop cards setiap item dan buat salinannya
  • akhirnya ganti item papan yang Anda inginkan dan kemudian
  • kembalikan papan yang baru dibuatArr
// Pseudo code inside reducer

const newBoardsArr = state.map(board => {
    return {
        ...board,
        items: board.items.map(item => ({
            ...item,
            cards: item.cards.map(card => ({
                ...card
            }))
        }))
    }
});

// lets say we want to update first board's items, then:

newBoardsArr[action.payload.boardID].items = newList;
return newBoardsArr;

1
nishkaush 20 November 2020, 10:44