[解決済み] ユーザが入力を止めたときだけ検索を開始するには？

質問

ユーザーが入力を止めたときに検索を実行する必要があります。 setTimeout() . しかし Reactjs私はそれがどのように動作するかを見つけることができません。 私はユーザーが入力を停止したことを確認するためにコードを書く場所を見つけることができない、数秒間（仮に5）入力が停止したときにメソッド（検索を処理する）を呼び出す方法を教えてください。

import React, {Component, PropTypes} from 'react';

export default class SearchBox extends Component {

    state={
      name:" ",
    }

    changeName = (event) => {
        this.setState({name: event.target.value}); 
    }

    sendToParent = () => {
        this.props.searching(this.state.name);
    }

    render() {
        return (
            <div>
                 <input type="text"  placeholder='Enter name you wish to Search.'  onChange={this.changeName} />

            </div>
        );
    }
}   

ユーザーが入力を止めたときにsendToParentメソッドを起動したい。

どのように解決するのですか？

この場合 setTimeout を、あなたのコードに関して次のように記述します。

state = {
    name: '',
    typing: false,
    typingTimeout: 0
}
changeName = (event) => {
    const self = this;

    if (self.state.typingTimeout) {
       clearTimeout(self.state.typingTimeout);
    }

    self.setState({
       name: event.target.value,
       typing: false,
       typingTimeout: setTimeout(function () {
           self.sendToParent(self.state.name);
         }, 5000)
    });
}

また changeName ハンドラ関数をコンストラクタにバインドする必要があります。

constructor(props) {
   super(props);
   this.changeName = this.changeName.bind(this);
}