Intenté configurar el valor predeterminado para que sea "Sillas" y no funciona.
Estos son los codigos:
import React, { useState } from "react"; import TextField from "@mui/material/TextField"; import Autocomplete from "@mui/material/Autocomplete"; import { Items2 } from "./Items2"; export default function ComboBox() { const [selected, setSelected] = useState(""); console.log(selected); return ( <> you selected: {selected} <br /> <br /> <Autocomplete disablePortal isOptionEqualToValue={(option, value) => option?.label === value?.label} id="combo-box-demo" options={Items2} defaultValue="Chairs" fullwidth value={selected} onChange={(event, value) => setSelected(value)} renderInput={(params) => <TextField {...params} label="Items" />} /> </> ); }También en codesandbox: https://codesandbox.io/s/combobox-material-demo-forked-g88fi?file=/demo.js:0-904
Solo necesita establecer el valor predeterminado para el estado selected y eliminar defaultValue del componente Autocomplete :
import React, { useState } from "react"; import TextField from "@mui/material/TextField"; import Autocomplete from "@mui/material/Autocomplete"; import { Items2 } from "./Items2"; export default function ComboBox() { const [selected, setSelected] = useState("Chairs"); console.log(selected); return ( <> you selected: {selected} <br /> <br /> <Autocomplete disablePortal isOptionEqualToValue={(option, value) => option?.label === value?.label} id="combo-box-demo" options={Items2} fullwidth value={selected} onChange={(event, value) => setSelected(value)} renderInput={(params) => <TextField {...params} label="Items" />} /> </> ); }