Quiero que el valor predeterminado de mi menú desplegable sea defaultValue={item.taste} (valor de match.json ) pero no funciona... (vaya a /menu/Menu1 y Pea Soup)

 import Select from "react-select"; export default function CustomDropdown({ style, options, defaultValue }) { return ( <div style={style}> <Select options={options} defaultValue={defaultValue} /> </div> ); }

Visualización del elemento de menú:

 export default function MenuItemDisplay() { const { menuId, itemId } = useParams(); const { match } = JsonData; const matchData = match.find((el) => el._id_menu === menuId)?._ids ?? []; const item = matchData.find((el) => el._id === itemId); const styles = { select: { width: "100%", maxWidth: 150 } }; const TASTE = [ { label: "Good", value: "Good" }, { label: "Medium", value: "Medium" }, { label: "Bad", value: "Bad" } ]; ... return ( <> <div className="TextStyle"> {"Taste "} <CustomDropdown style={styles.select} options={TASTE} defaultValue={item.taste} //The default value is not working only if it's //TASTE[0] /> </div> ... </> ); }

Aquí el enlace para el código.