tmegos blog

I love school idols / Web developer

React Selectのstylesの対象一覧

ReactのSelect componentのひとつにReact Selectがあります

react-select.com

独自のスタイルを適用するためにstylesプロパティがありますが、
style keyがどこに該当するのかよくわからなかったのでサンプルコードを書いてみました
スタイルが当たるところが灰色の枠で表示されます

https://react-select.com/styles#style-object

STYLE KEYS

  • clearIndicator
  • container
  • control
  • dropdownIndicator
  • group
  • groupHeading
  • indicatorsContainer
  • indicatorSeparator
  • input
  • loadingIndicator
  • loadingMessage
  • menu
  • menuList
  • menuPortal
  • multiValue
  • multiValueLabel
  • multiValueRemove
  • noOptionsMessage
  • option
  • placeholder
  • singleValue
  • valueContainer

サンプルコードはこちらです

React Select Styles - CodeSandbox