Блог

Например, я хочу извлекать данные при нажатии кнопки. куда я должен поместить свою функцию выборки, я обычно помещаю свою функцию выборки в функцию обработчика.

 // in my component
async handleButton(){
    if(!this.state.data){
        let data = await fetchFunction();
        this.setState({
          state_data : data    
        });
    }
}

render(){
    <button onClick={this.handleButton}>fetch data</button>
}
 

но в react жизненный цикл предоставляет componentDidUpdate для извлечения данных. ниже приведен контент в документе react, описывающий componentDidUpdate.

Это также хорошее место для выполнения сетевых запросов, если вы сравниваете текущие реквизиты с предыдущими реквизитами (например, сетевой запрос может не потребоваться, если реквизиты не изменились).

И я думаю, что документ означает, что я должен писать так?

 // in my component
handleButton(){
    if(!this.state.data){
       this.setState({
         need_fetch_data : true    
       });
    }
}
async componentDidUpdate(){
   if(this.state.need_fetch_data amp;amp; !this.state.data){
      let tmp = await fetchFunction();
      this.setState({
          data : tmp;
      })
   }
}

render(){
    <button onClick={this.handleButton}>fetch data</button>
}
 

и я думаю, что второй способ будет отображаться на один раз больше, чем первый метод. Так что это не нормально.

спасибо за любой ответ!!