从Firebase删除项目后如何“刷新” React JS页面

Question

ReactJS。我有一个从Firebase数据库填充的列表。

我有一个删除按钮，可从某个用户中找到最后一个条目，并从数据库中删除该条目。

但是，原始列表在屏幕上保持不变。我需要某种“刷新”（作为React JS，也许这不是最好的词）。

我已经尝试创建refresh（）函数，并且确实从数据库发送了更新的列表，但是，这个新列表被添加到了旧列表的底部，应该替换掉。

编辑：在写出这个问题时，我意识到我需要做的！我将把我在这里所做的工作留给像我这样的未来React JS新手...

单击删除按钮后会调用onDelete函数...

// DELETE LAST USER COMMENT 
  onDelete = () => {
    //  delete last message code he
    let userName = this.state.name;
    console.log(userName);
    messageRef.orderByChild('name').equalTo(userName).limitToLast(1).once('child_added', function (snapshot) {
      snapshot.ref.remove();
    })
    this.refresh()
  }

  refresh = () => {
    const previousMessages = [];
    messageRef.on('child_added', snapshot => {
      previousMessages.push({
        id: snapshot.key,
        message: snapshot.val().text,
        name: snapshot.val().name
      })
      this.setState({
        list: previousMessages
      })
    })
  }

Answer 1

我制作了refresh（）作为ComponentDidMount（）函数的直接副本。但是，我需要清空声明的const previousMessages = [];数组，而不是在ComponentDidMount（）中将其保留为const previousMessages = this.state.list;。