I’m trying to view the fetched data on MUI Autocomplete, but I get this error I don’t why, the stat is fetched from MongoDB and I’m just trying to view the name of the category as an option.
The Code:
export default function ChooseCat() { const [categories, setCats] = useState([]); useEffect(() => { const getCats = async () => { const res = await axios.get("/categories"); setCats(res.data); }; getCats(); }, []); console.log(categories) return( <div> <Autocomplete multiple id="tags-standard" options={categories} getOptionLabel={(c) => c.name} defaultValue={[categories[3]]} renderInput={(params) => ( <TextField {...params} variant="standard" label="Multiple values" placeholder="Favorites" /> )} /> </div> ) }
This is how the data is showing in Mongodb
Advertisement
Answer
So I added this and it worked getOptionLabel={option => (option ? option.name : "")}