当数据来自服务器时如何使用react select

弹出窗口.js

import React from 'react';
import ReactDOM from 'react-dom';

import SourcesSelector from './sources-selector';

class Popup extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            error: null,
            isLoaded: false,
            sources: []
        };
    }

    componentDidMount() {
        fetch("http://theserver/getdata.php")
            .then(res => res.json())
            .then(
                (result) => {
                    this.setState({
                        isLoaded: true,
                        sources: result.sources
                    });

                },
                (error) => {
                }
            )
    }

    render() {
        return (
            <div>
                <SourcesSelector sources={this.state.sources}/>
            </div>
        );
    }
}

ReactDOM.render(<Popup/>, document.getElementById('app'));

来源-选择器.js

import React from 'react';
import Select from 'react-select';

export default class SourcesSelector extends React.Component {


    constructor(props) {
        super(props);
        this.state = {
            sources: props.values,
            selectedValues: []
        }

    }
    render() {

        return (
            <Select options={this.state.sources} />
        );
    }
}