https://bespoke-strudel-4aaf9c.netlify.app/
Información destacada:
-
"onChange: (value: SelectOption | undefined) => void": Si no se tiene un valor éste puede ser indefinido, y esta es una función vacía que no retorna nada.
-
"options: SelectOption[]" significa que se tiene una lista de opciones.
-
"value?: SelectOption" es opcional y se refiere a la opción seleccionada actualmente.
-
"... = useState<typeof options[0] | undefined>": Una variable de estado puede ser o una opción o el valor de undefined si aún no hemos puesto un valor.
-
"className={
${styles.options} ${isOpen ? styles.show : ""}}>": Si isOpen es verdadero, podemos usar el estilo show, y si es falso, se usa un estilo vacío. -
"type SelectOption" es una sola opción que tiene las propiedades tipadas label y value.
-
"SelectOption[]" es un array de opciones.
Highlighted information:
-
"onChange: (value: SelectOption | undefined) => void": If we don't have a value it can be undefined, and this is a void function that returns nothing.
-
"options: SelectOption[]" means we have a list of options.
-
"value?: SelectOption" is optional and refers to the currently selected option.
-
"... = useState<typeof options[0] | undefined>": A state variable can be either an option or it can be the value of undefined if we haven't set a value yet.
-
"className={
${styles.options} ${isOpen ? styles.show : ""}}>": If isOpen is true, we can use the show style, otherwise just do an empty style. -
"type SelectOption" is a single option that has the typed properties label and value.
-
"SelectOption[]" is an array of options.