javascript - 举例来说，Material UI 中的 `getOptionSelected` 和 `getOptionLabel` 是什么？

Question

我正在查看 Autocomplete 中的 Mui 文档。组件部分我有两个 props , getOptionLabel和 getOptionSelected我得到了定义，但我没有正确理解它。因此，如果有人可以通过示例以简单的方式给我正确的定义，那就太好了

Answer 1

getOptionLabel用于在下拉菜单中显示文本
EX:自动完成数组

const top100Films = [
  { title: 'The Shawshank Redemption', year: 1994 },
  { title: 'The Godfather', year: 1972 },
  { title: 'The Godfather: Part II', year: 1974 },
  { title: 'The Dark Knight', year: 2008 }
}

<Autocomplete
  id="combo-box-demo"
  options={top100Films}
  getOptionLabel={(option) => option.year.toString()} // in the dropdown the option text will be year,if we use like option.title then it will show the title of the movie in dropdown
......

getOptionSelected这用于确定给定数组的选定值

<Autocomplete
  id="combo-box-demo"
  options={top100Films}
  getOptionSelected={(option) => option.year === 1994}
....
//this will select all the option which has year as 1994 and make the background of that option darker

demo