How to use the react-select.Async function in react-select

if (required) {
    inputNote = <span>required</span>;
  }

  let reactSelectClasses = cssClass.REACT_SELECT;
  if (readOnly) {
    reactSelectClasses += ` ${cssClass.READ_ONLY}`;
  }

  let SelectComponent = ReactSelect;
  if (creatable &amp;&amp; lazy) {
    SelectComponent = ReactSelect.AsyncCreatable;
  } else if (creatable) {
    SelectComponent = ReactSelect.Creatable;
  } else if (lazy) {
    SelectComponent = ReactSelect.Async;
  }

  // The label container must be returned after the ReactSelect otherwise it does not get displayed
  // in the browser.
  return (
    <div>
      <div id="{id}">
        </div></div>

_getSelectComponent() {
    const {async, selectComponent} = this.props;

    if (selectComponent) {
      return selectComponent;
    } else if (async) {
      return Select.Async;
    } else {
      return Select;
    }
  }

const SelectBT = ({ col, options, async, name, onChange, value, list, className = '', edited, ...rest }) => {
  const SelectComponent = async ? Select.Async : Select
  const { valueKey, labelKey } = rest

  options = list ? selectLists[list] : options

  if (options && Array.isArray(options) && options.length > 0 && typeof options[0] !== 'object') {
    options = options.reduce((arr, option) => {
      const value = typeof option === 'object' ? option[valueKey] : option
      const text = typeof option === 'object' ? option[labelKey] : option

      return [...arr, { label: text, value }]
    }, [])
  }

  return (

"rbc-title-inactive": !this.props.title,
			"rbc-placeholder-active": this.props.placeholder,
			"rbc-placeholder-inactive": !this.props.placeholder
		}, this.props.className);

		return React.createElement(
			"div",
			{ className: "rbc rbc-geodistancedropdown clearfix card thumbnail col s12 col-xs-12 " + cx, style: this.props.style },
			React.createElement(
				"div",
				{ className: "row" },
				title,
				React.createElement(
					"div",
					{ className: "rbc-search-container col s12 col-xs-12" },
					React.createElement(Select.Async, {
						value: this.state.currentValue,
						loadOptions: this.loadOptions,
						placeholder: this.props.placeholder,
						onChange: this.handleChange,
						filterOption: function filterOption() {
							return true;
						},
						valueRenderer: this.renderValue
					})
				),
				React.createElement(
					"div",
					{ className: "col s12 col-xs-12" },
					React.createElement(Select, {
						name: "distance",
						placeholder: this.props.placeholderDropdown,

_getSelectComponent () {
    const { async, selectComponent } = this.props

    if (selectComponent) {
      return selectComponent
    } else if (async) {
      return Select.Async
    } else {
      return Select
    }
  }

render() {
        const AsyncComponent = Select.Async
        return (
            <div>  
               
            <div>
                <div>
                <menu>
                </menu></div>
                <div>
               
                     this.msg = a} {...this.alertOptions} /&gt;
                    <div style="{{marginTop:&quot;5%&quot;}}">
                        <h4>Dropbox</h4>
                    </div>
                    

                    </div></div></div>

"rbc-title-inactive": !this.props.title,
			"rbc-placeholder-active": this.props.placeholder,
			"rbc-placeholder-inactive": !this.props.placeholder
		}, this.props.className);

		return React.createElement(
			"div",
			{ className: "rbc rbc-placessearch clearfix card thumbnail col s12 col-xs-12 " + cx, style: this.props.style },
			React.createElement(
				"div",
				{ className: "row" },
				title,
				React.createElement(
					"div",
					{ className: "col s12 col-xs-12" },
					React.createElement(Select.Async, {
						value: this.state.currentValue,
						loadOptions: this.loadOptions,
						placeholder: this.props.placeholder,
						onChange: this.handleChange,
						valueRenderer: this.renderValue
					})
				)
			)
		);
	};

render () {
		const AsyncComponent = this.state.creatable
			? Select.AsyncCreatable
			: Select.Async;

		return (
			<div>
				<h3>{this.props.label} <a href="https://github.com/JedWatson/react-select/tree/master/examples/src/components/GithubUsers.js">(Source)</a></h3>
				
				<div>
					<label>
						<input checked="{this.state.multi}" type="radio">
						<span>Multiselect</span>
					</label>
					<label>
						<input checked="{!this.state.multi}" type="radio">
						<span>Single Value</span>
					</label>
				</div>
				<div></div></div>