MUI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string

Viewed 4588

I am having trouble configuring this error (below), when I click the autocomplete search the display data is blank the error shows on the console

when i tried to type

enter image description here

the api fetch on when the user typing

enter image description here

where did i get wrong?

LocationSearch

const propTypes = {
  getOptionLabel: PropTypes.func,
  value: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
}
const defaultProps = {
  getOptionLabel: () => {},
  value: '',
}
const LocationSearch = ({
  getOptionLabel,
  value,
})

   ....

   <Autocomplete
      getOptionLabel={getOptionLabel}
      value={value}
   />

Parent

import {LocationSearch} from '../../component/LocationSearch'

......


<LocationSearch
   getOptionLabel={(options) => options.title}
   value={threatLocation}
/>

error

enter image description here

1 Answers

try providing an array of objects in the getOptionLabel parameter as autocomplete option maps data and find the key as you are looking for maybe that works.

   <Autocomplete
      getOptionLabel={[{title:'a', name: 'a'}, {title:'b', name: 'b'}]}
      value={value}
   />
Related