javascript - React-Select: 選択した項目をメニューに保持

Question

v1.0.0-beta10 でReact-Selectを使用して、 MaterializeCssで複数選択と同様に動作するドロップダウンを実装できるようにするために、選択したアイテムをメニューに保持したいと思います。

ここにスクリーンショットがあります：

この動作を達成する方法は？

Answer 1

プロパティ options、searchFilter、selectedOptions を受け取る関数を受け入れる filterOptions という prop にアクセスできます。

以下のように selectedOptions を取り除くのではなく、検索フィルターに一致するオプションを常に返すことができるはずです (underscore/lodash を使用している場合。または、独自のメソッドを記述します。

const filterOptions = (options, searchFilter, selectedOptions) => {
  return _.filter(options, options => _.includes(option.value, searchFilter));
}

その後

<Select {...props} filterOptions={filterOptions} />

この例が役立つことを願っています。