2

私は React を初めて使用します。React をスタンドアロン サービスとして使用する方法に関する公式の React チュートリアルを読み、Rails アプリで react-rails gem を使用する方法に関するこのチュートリアルを読み終えました。まさに私が必要とするものになるために。私が直面している問題は、小さな React ページにある種の単純な API ポーリングを実装する必要があることですが、react-rails でこれを最適に実装する方法に関するドキュメントがどこにも見つからないようです。

反応チュートリアル中にpollinterval = 2000、データ ソースを宣言するときに使用して、2000 ミリ秒ごとにソースをポーリングするように指示されます。これを次のように実装しようとしましたが、役に立ちませんでした。

@Records = React.createClass
    getInitialState: ->
      $.ajax
        method: 'GET'
        url: '/records'
        dataType: 'JSON'
        success: (response) ->
          records: response
      pollinginterval: 2000
    ...

残念ながら、ページをロードすると、実際にはコンテンツが表示されないだけでなく、データベースにまったくクエリを実行していないように見えます。これは、これがAJAX呼び出し/ポーリング間隔の設定に適切な場所ではないと私に信じさせますが、私のグーグルでは何も特に役に立ちませんでした.

4

2 に答える 2

2

このアプローチはどうですか？

@Records = React.createClass
  getInitialState: ->
    # `this.state.records` is empty now, but will be loaded by AJAX
    {
      records: [] 
    }

  componentDidMount: ->
    # Ping every 2s
    @_recordsInterval = setInterval =>
        @_loadRecords()
      , 2000
    # Load initial data: 
    @_loadRecords()

  componentWillUnmount: -> 
    # clean up loose ends: 
    clearInterval(@_recordsInterval)
    @_recordsRequest?.abort()

  # ...

  _loadRecords: ->
   # Fetch records from the server and store it as `this.state.records`
   @_recordsRequest = $.get "/records", (data) => 
     @setState(records: data)
于 2016-03-17T13:46:07.517 に答える