反应状态数组不更新

时间:2019-12-04 23:11:28

标签: arrays reactjs state

我正在尝试使用下面的新数组更新状态,但是即使控制台未显示任何错误并按照应形成的格式正确打印了新数组,状态也不会更新以反映这一点。

我在做什么错了?


state = {
    notes: [
      {
        text: "mow the lawn",
        author: "dean",
        time: "10am"
      },
      {
        text: "feed the dog",
        author: "sam",
        time: "2pm"
      }
    ]
  };


updateNotes = (title, name, eventTime) => {
    let newNote = {
      text: title,
      author: name,
      time: eventTime
    };
    this.setState(state => {
      const list = state.notes.concat(newNote);
      console.log(list); //shows the list formed correctly in the console
      return {
        list
      };
    });
  };

这里也提供参考,假设我在创建新笔记时输入了值,新文本,一些作者和下午3点,这是运行代码后在控制台中看到的。


(3) [{…}, {…}, {…}]
0: {text: "mow the lawn", author: "dean", time: "10am"}
1: {text: "feed the dog", author: "sam", time: "2pm"}
2: {text: "new text", author: "some author", time: "3pm"}

2 个答案:

答案 0 :(得分:3)

应该是:

return {
  notes: list
};

您现在要在状态中添加一个新变量list

答案 1 :(得分:2)

即使笔记位于list字段内,为什么还要更新称为notes的字段?

{ list }是创建对象的简写,该对象的字段名为 list ,值存储在以相同方式命名的变量中。

只需更新适当的字段即可:

return {
    notes: list,
};