reactjs - 为什么 componentDidUpdate 重复执行

Question

我正在尝试在提交时显示用户注释。在 componentDidMount 上，我正在向服务器发送一个 GET 请求以最初显示数据。当用户提交新评论时，我在 componentDidUpdate 上检查 prevState。如果发现任何差异，它应该从服务器加载新数据。

但是在 componentDidUpdate 内部，连续请求正在发送到服务器。

到目前为止我做了什么

componentDidUpdate(prevProps, prevState){
    if(prevState.status !== this.props.userDisplayNotes.status){

            // This is GET request to display the data from the server

            this.props.displayUserNotes(this.props.user_id)

    }
}


// Here I'm displaying data on initial rendering with GET request

componentDidMount(){
    this.props.displayUserNotes(this.props.user_id)
}

// This is form submit handler

handleSubmit = (e) => {      
    e.preventDefault();
    this.props.saveUserNote(this.props.user_id, this.state.userNote)

}

成功提交评论后，我收到来自服务器的响应，例如 {"status":"success"}

对于状态管理，我使用 Redux。

但在 componentDidUpdate 内部，它正在向服务器发送连续请求，导致应用程序崩溃。有人可以解释一下我在这里做错了什么吗？

Answer 1

您可以将以前的道具与新道具进行比较，它将解决您的问题

componentDidUpdate(prevProps, prevState){
if(prevProps.userDisplayNotes.status !== this.props.userDisplayNotes.status){
        this.props.displayUserNotes(this.props.user_id)
  }
}