Как добавить объект во вложенное состояние в React? - PullRequest
Новая
       37

Как добавить объект во вложенное состояние в React?

0 голосов
/ 03 августа 2020

Я создаю простое поле для комментариев, где пользователь может отвечать на комментарий. Я определил состояние следующим образом: 

  this.state = {
       comments: [
            {
                id: "TKT4321",
                message: "abc",
               
            },
            {
                id: "TKT34341",
                message: "cccccc",
                reply: [
                    { id: "TKT34343", message: "aaaaa" },
                ]
            },

        ],
        
    }

один объект из комментариев - это один комментарий, а ответ - пользователь ответил на этот комментарий 

          {
                id: "TKT34341",
                message: "cccccc",
                reply: [
                    { id: "TKT34343", message: "aaaaa" },
                ]
            },

то, что я хочу сделать, это когда пользователь ответил на комментарий, скажем, на комментарий с идентификатором "TKT4321", а затем добавить объект reply в этот список. например, 

              {
                id: "TKT4321",
                message: "abc",
                 reply: [
                    { id: "TKT34343", message: "gfgfg" },
                ]
            },

Если ответы уже есть в массиве reply , просто добавьте {id: "TKT341113", message: "ftrdgf"} объект к ответ массив. например, 

               {
                id: "TKT34341",
                message: "cccccc",
                reply: [
                    { id: "TKT34343", message: "aaaaa" },
                    { id: "TKT341113", message: "ftrdgf" },
                ]
            },

мое решение: 

    this.setState((state) => {
        const { comments } = state.comments
        return comments.map((item) => ({
            ...item,
            reply: [...item.reply, { id: "TK2222", message: "jkjk" }]
        }))
    })

Но с этим я не могу установить состояние. Я новичок в реагировании, и я не понимаю, как устанавливать состояние вложенных объектов. Пожалуйста, помогите.

1 Ответ

0 голосов
/ 03 августа 2020

Вы возвращаете комментарии как новое состояние, без ключа comments, перезаписывая все состояние. Вместо этого сделайте следующее: 

 this.setState((state) => {
        const { comments } = state.comments
        return {  // Add an object around the comments
            comments.map((item) => ({
                ...item,
                reply: [...item.reply, { id: "TK2222", message: "jkjk" }]
            }))
        };
    })
...