反應選擇異步選項，

我想使用this component與使用es5的異步選項。我在我的componentDidmount服務調用，它使用一個回調設置學校陣列：反應選擇異步選項，

componentDidMount: function(){ 

    SchoolsDataService.getSchools(
     this.setSchoolsState 
    );

哪個學校列表設置爲狀態數組

setSchoolsState: function(data){ 

    this.setState({schools: data.schools}) 

},

服務：

getSchools: function (callback) { 

    var url = 'xxxx'; 

    request 
     .get(url) 
     .set('Accept', 'application/json') 
     .end(function (err, res) { 
      if (res.ok) { 
       var data = res.body; 
       if (data) { 
        callback(data); 
       } 
      } 
     }); 
}

如何我可以使用文檔中的示例進行設置嗎？我會在哪裏將這種異步版本的服務調用並生成選項列表？

<Select.Async 
     name="form-field-name" 
     value="one" 
     loadOptions={getOptions}/>

我得到這個錯誤：

var getOptions = function(input, callback) { 
setTimeout(function() { 
    callback(null, { 
     options: [ 
      { value: 'one', label: 'One' }, 
      { value: 'two', label: 'Two' } 
     ], 
     // CAREFUL! Only set this to true when there are no more options, 
     // or more specific queries will not be sent to the server. 
     complete: true 
    }); 
}, 500); 
};

我的組件使用呈現

未捕獲不變違規：元素類型無效：預期字符串（內置組件）或類/函數（用於複合組件），但得到：未定義。檢查TableModalComponent的渲染方法。

我有它在我的頁面的頂部：

Select = require('react-select'),

來源

2016-04-01 Bomber

我想你這裏有2個不同的選項：

要麼你留在componentDidMount您的服務請求，其更新本地狀態，然後您不需要異步選項，因爲您可以直接將選項= {this.state.schools}傳遞給選擇組件，因此您不需要本地狀態（也不需要componentDidMount服務調用），因此您可以直接將選項= {this.state.schools}傳遞給選擇組件直接在getOptions f中執行服務調用（用於異步選項選擇組件）：

var getOptions = function(input, callback) { 
    setTimeout(function() { 
     SchoolsDataService.getSchools(function(data) { 
      callback(null, { 
       options: data.schools, 
       complete: true, 
      }); 
     }); 
    }, 500); 
};

來源

2016-04-01 10:54:16

反應選擇異步選項，

回答

相關問題