react-select - react-select 作为全向搜索框

Question

我有一个 Rails 后端对我的联系人信息进行全文搜索，包括他们的电子邮件、电话号码等。

  class ContactServiceController < ApplicationController
    def search
      query = User.search_for_contacts(params[:query])
      @contacts = query.results
      render :index
    end      
  end

它返回一个只有名字和姓氏的联系人数组。

[{first: 'John', last:'doe'}, {first: 'jane', last: 'doe'}]

使用 react-select，我希望如果用户输入 john@doe.com，返回的记录将显示在下拉菜单中，我知道我不太可能突出显示该列表中的正确项目，但它很高兴只是展示它。可能吗？

这是我的反应选择组件

    <Select.Async
        name="contact-select"
        value={id}
        loadOptions={getOptions || this.getOptions}
        onChange={this.onChange}
        allowCreate={true}
    />

    const prepareContactsData = contacts => 
      map(contacts, (contact) => 
        (
          {
            label: contact.full,
            value: contact.id,
          }
        )
    )


    const getOptions = (query, callback) => {
      if(!query.length){
        return callback(null, [])
      }
      return contactServiceApi
              .search({query})
              .then( data => {
                callback(null, 
                  {
                    options: prepareContactsData(data.contacts)
                  }
                )
              })
    }

谢谢你！