<option>

El componente integrado <option> del navegador te permite mostrar una opción dentro de un cuadro <select>.

<select>
  <option value="someOption">Alguna opción</option>
  <option value="otherOption">Otra opción</option>
</select>

Referencia
- <option>
Uso
- Mostrar un cuadro de selección con opciones

Referencia

`<option>`

El componente integrado <option> del navegador te permite mostrar una opción dentro de un cuadro <select>.

<select>
  <option value="someOption">Alguna opción</option>
  <option value="otherOption">Otra opción</option>
</select>

Ver más ejemplos abajo.

Props

<option> es compatible con todas las props de elementos comunes.

Además, <option> admite estas props:

disabled: Un booleano. Si es verdadero, la opción no se podrá seleccionar y aparecerá atenuada.
label: Una string. Especifica el significado de la opción. Si no se especifica, se utiliza el texto dentro de la opción.
[value](https://developer.mozilla.org/es/docs/Web/HTML/Element/option#attr-value: El valor que se usará al enviar el <select> padre en un formulario si se selecciona esta opción.

Advertencias

React no admite el atributo selected en <option>. En su lugar, pasa el value de esta opción al padre <select defaultValue> para un cuadro de selección no controlado, o <select value> para un cuadro de selección controlado.

Uso

Mostrar un cuadro de selección con opciones

Representa un <select> con una lista de componentes <option> dentro para mostrar un cuadro de selección. Asigna a cada <option> un value que represente los datos que se enviarán con el formulario.

Obtén más información sobre cómo mostrar un <select> con una lista de componentes <option>.

Bifurcar

export default function FruitPicker() {
  return (
    <label>
      Pick a fruit:
      <select name="selectedFruit">
        <option value="manzana">Manzana</option>
        <option value="banano">Banano</option>
        <option value="naranja">Naranja</option>
      </select>
    </label>
  );
}

Anterior<input>

Siguiente<progress>