使用 settimeout 和 setstate 在反应中去抖动

时间:2021-01-03 08:02:29

标签: reactjs api asynchronous settimeout debouncing

这是可接受的代码吗?我已经测试过它并且它有效,但我不知道这是否是好的做法。每次有人在输入中输入内容时,我基本上都会调用数据。但那是太多的 api 调用。所以我做了所谓的“去抖动”,以便在他们停止打字时调用 api。

我想更简单的方法是有一个按钮,这样他们就可以在按下按钮时拨打一个电话。但我正在尝试输入 onchange 方法。

class Weather extends React.Component{
state={
    data:[],
    target:'',
    timer:null
}
componentDidMount(){
    this.setState({timer:null})
}
handleChange=(e)=>{
    this.setState({
        target: e.target.value
    })
    clearTimeout(this.state.timer);
    this.setState({timer:setTimeout(()=>{
        this.fetch_geocodes()
    },2000)})
}

0 个答案:

没有答案