ここで奇妙なもの。React-Select v1.0.0rc を使用する場合 (すべての v1.x でバグが発生しますが)、非同期モードで使用して API を検索すると、オプションがドロップダウン メニューに表示されないことがあります。これが発生する理由はないようですが、特定の検索クエリで発生し、他のクエリでは発生しません。
たとえば、どちらも同様の結果を返しますcoconut
が、機能しますが機能しません。coconut oil
奇妙なことに、React chrome 開発者ツールを使用すると、Select の状態にオプションが設定されていることがわかりますが、表示されません。また、react-select をクリックしてからもう一度クリックすると、結果が表示されます (firefox と chrome でテスト済み)。これが私のコードと説明するためのいくつかのスクリーンショットです
<Select.Async name={ this.generateName('ingredient_id')}
loadOptions={this.getIngredients}
className="admin-meal-ingredient-search-select"
autoload={false}
cache={false}
multi={false}
value={this.props.ingredient}
onChange={this.props.handleIngredientChange}
placeholder="Search for ingredient" />
ここで、何かを入力しましたが、結果が表示されないことがわかります
ここでは、オプション配列の React インスペクターで結果を確認できます。
クリックしてからボックスに戻ると、オプションは次のとおりです。
現れる