1

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);
                }
            }
        });
}

ドキュメントの例を使用してこれを設定するにはどうすればよいですか? このような非同期バージョンのサービス呼び出しをどこに置き、オプション リストを生成しますか?

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);
};

MY コンポーネントは次を使用してレンダリングされます。

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

次のエラーが表示されます。

Uncaught Invariant Violation: 要素の型が無効です: 文字列 (組み込みコンポーネントの場合) またはクラス/関数 (複合コンポーネントの場合) が必要ですが、得られたのは未定義です。のレンダリング方法を確認してくださいTableModalComponent

私のページの上部にあります:

Select = require('react-select'),
4

1 に答える 1