Javascript React引导程序Typeahead无法呈现返回的数据

在文档中的示例中，它显示了以下内容：

<AsyncTypeahead
  onSearch={query => (
    fetch(`https://api.github.com/search/users?q=${query}`)
      .then(resp => resp.json())
      .then(json => this.setState({options: json.items}));
  )}
  options={this.state.options}
/>

这是我应该返回选项的函数。。。我怀疑它不是，至少不是AsyncTypeahead需要的格式

  handleSuburbSearch = (query) => {
    const {selectData} = this.props
    const companyStateId = selectData.companyStateId

    if (!query) {
      return;
    }
    const queryString = {
      query: query,
      companyStateId: companyStateId,
    }
    const suburbs = getSuburbs(queryString)
    return suburbs
  };

下面是我的AsyncTypeahead的结构：

<AsyncTypeahead
  name={name}
  onSearch= {query => (handleSuburbSearch(query))}
  renderMenuItemChildren={(options) => renderMenuItemChildren(options)}
  placeholder="Select Suburb"
/>

来自React引导程序Typeahead的示例：

 const AsyncExample = React.createClass({
  getInitialState() {
    return {
      allowNew: false,
      multiple: false,
      options: [],
    };
  },

  render() {
    return (
      <div>
        <AsyncTypeahead
          {...this.state}
          labelKey="login"
          onSearch={this._handleSearch}
          placeholder="Search for a Github user..."
          renderMenuItemChildren={this._renderMenuItemChildren}
        />
        {this._renderCheckboxes()}
      </div>
    );
  },

  _renderCheckboxes() {
    const checkboxes = [
      {label: 'Multi-Select', name: 'multiple'},
      {label: 'Allow custom selections', name: 'allowNew'},
    ];

    return checkboxes.map(({label, name}) => (
      <Checkbox
        checked={this.state[name]}
        key={name}
        name={name}
        onChange={this._handleChange}>
        {label}
      </Checkbox>
    ));
  },

  _renderMenuItemChildren(option, props, index) {
    return (
      <div key={option.id}>
        <img
          src={option.avatar_url}
          style={{
            height: '24px',
            marginRight: '10px',
            width: '24px',
          }}
        />
        <span>{option.login}</span>
      </div>
    );
  },

  _handleChange(e) {
    const {checked, name} = e.target;
    this.setState({[name]: checked});
  },

  _handleSearch(query) {
    if (!query) {
      return;
    }

    fetch(`https://api.github.com/search/users?q=${query}`)
      .then(resp => resp.json())
      .then(json => this.setState({options: json.items}));
  },
});

const AsyncExample=React.createClass({
getInitialState（）{
返回{
allowNew:错，
多重：假，
选项：[]，
};
},
render（）{
返回(
文档区域中的示例

<AsyncTypeahead
  onSearch={query => (
    fetch(`https://api.github.com/search/users?q=${query}`)
      .then(resp => resp.json())
      .then(json => this.setState({options: json.items}));
  )}
  options={this.state.options}
/>

(
取回(`https://api.github.com/search/users?q=${query}`）
.then（resp=>resp.json（））
.then（json=>this.setState（{options:json.items}））；
)}
选项={this.state.options}
/>
您似乎从未将提取的数据传递回typeahead。请注意，在文档/示例中，
this.state.options
被传递到组件，而
options
在
fetch
调用中被设置。您似乎从未将提取的数据传递回typeahead。请注意，在文档/exa中mples，
this.state.options
传递给组件，并在
fetch
调用中设置
options
。
<AsyncTypeahead
  onSearch={query => (
    fetch(`https://api.github.com/search/users?q=${query}`)
      .then(resp => resp.json())
      .then(json => this.setState({options: json.items}));
  )}
  options={this.state.options}
/>