反应选择异步选项，

我想使用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

反应选择异步选项，

回答

相关问题