React-выберите ширину опции контейнера

Question

Я пробую библиотеку реагировать, и мне это нравится.

Я играю с этим, но я не понимаю, как изменить ширину контейнера опций.

Я пытался просмотреть документацию на официальном реагировании select , но не нашел нужного раздела о ширине контейнера опций.

Может ли кто-нибудь любезно помочь мне :)?

это мой собственный стиль прямо сейчас:

const customStyles = {
      option: (provided, state) => ({
        ...provided,
        borderBottom: '1px solid #979797',
        width: 219,
        borderRadius: 5,
      }),
      control: () => ({
        // none of react-select's styles are passed to <Control />
        width: 219,
        border: '1px solid #979797',
        display: 'flex',
        borderRadius: '5px',
      }),
      valueContainer: (provided) => ({
        ...provided,
        width: 219,
      }),
    }

Answer 1

Компонент Menu - это тот, который вы хотите изменить:

menu: (provided, state) => ({
  ...provided,
  width: 50,
}),

Answer 2

Вы можете передать селектор для контейнера, как

const colourStyles = {
  control: styles => ({ ...styles, backgroundColor: 'white' }),
  container: styles => ({ ...styles,  width: 200 })
};

<Select
  defaultValue={colourOptions[2]}
  label="Single select"
  options={colourOptions}
  styles={colourStyles}
/>

Демо