Какова альтернатива выбранному по умолчанию в React?

В HTML я получил что-то подобное для выбора.

Что он делает, так это значение по умолчанию, отображаемое для раскрывающегося списка выбора, Select yearно его нельзя выбрать.

<select>
 <option disabled hidden selected>
 Select Year
 </option>
 <option value="2021">2021</option>
</select>

Но когда я реализую это в React.

Это дает мне эту ошибку

Используйте реквизиты defaultValueor valueвместо установки selectedon.

Но когда я использую default valueили value опции SELECT YEAR больше нет.

Решение проблемы

Все, что вам нужно, это удалить оба атрибута selectedи из first:disabled<option>

<select>
 <option hidden>Select Year</option>
 <option value="2021">2021</option>
</select>

Вот почему:

<select>является сокращением для, что делает выбор <select defaultValue={undefined}>первым <option>с a valueof. undefinedВ вашем случае это первое <option>, так как у него нет set value, что эквивалентно valueнабору для undefined.

Вероятно, самый важный бит — это удаление disabled. Помните, что это JSX, а не HTML. JSX используется React для создания корректного HTML. Если вы укажете disabledатрибут, React не позволит <option>его выбрать, независимо от метода.
Но вы хотите, чтобы это <option>было выбрано по умолчанию, поэтому нет смысла его отключать.
Вы только хотите, чтобы пользователь не мог выбрать его, что и hiddenделает атрибут.

Рабочая демонстрация.