react下必定時間內若是條件變化不進行請求

在react組件中實現一個在必定時間內若是條件變化不進行請求的功能

---

具體需求：在搜索框中輸入內容，在輸入框中內容變化的狀況下將內容進行條件請求後臺，可是輸入內容每次的變化都會發生請求，有許多請求是不須要。一個大概的解決方法是，若是0.5s內該輸入框中內容發生了變化，則不進行請求，超過0.5s，輸入內容無變化則發送請求。

如下是做者的一個實現方式：

在state中：

state: {
    timeoutId: ''  // 用於存儲當前timeoutId，用於中斷
}

在render中：

<Input onChange={this.inputChange.bind(this)} />

inputChange方法：

inputChange(e){
    e.persist() // 保留事件，否則在異步中獲取不到event

    // 500ms之內有新的請求進來則清除請求，若是500ms之內沒執行清除，那請求就會被執行
    clearTimeout(this.state.timeoutId)

    let timeoutId = setTimeout( () => {
        ((e) => {
            // 這裏進行請求操做，someCode
        })(e)
    }, 500 )
    
    // 每次都將新的timeoutId保存下來
    this.setState({
        timeoutId
    })
}