Empecé a aprender Material UI y tengo una pregunta.
tenemos un objeto
const top100Films = [ { label: 'The Shawshank Redemption', year: 1994 }, { label: 'The Godfather', year: 1972 }, * ...More items * ] En este momento, si configuro getOptionLabel = {option => option.label} en mi Autocompletar, solo buscará por etiqueta coincidente (título), por lo que si ingreso un año, es decir, "1994", no mostrará "The Shawshank Redemption" en mi resultados de búsqueda, y si lo configuro en option.year , solo buscará por año y cualquier entrada, excepto el año, no será válida.
Aquí está mi pregunta: ¿Hay alguna forma de configurarlo para que pueda buscar tanto por título como por año?
Solución:
<Autocomplete ... filterOptions={(options, { inputValue }) => options.filter(item => item.label.toLowerCase().includes(inputValue) || item.year.toString().includes(inputValue) )} />La API de autocompletar de MUI tiene filterOptions ( documentos aquí ) donde puede configurar un filtrado personalizado.
Lo implementaría algo como:
<Autocomplete ... filterOptions={(options, { inputValue }) => options.filter(item => item.label.includes(inputValue) || item.year.toString.includes(inputValue) )} />