Javascript 如何访问自动完成'；s复选框和存储标题（如果通过钩子签入状态）？

我使用的是React Material UI Autocomplete，其中包含复选框（这里是到目前为止的代码，请参阅demo.js）：

我想将所有签入钩子的食物名称存储起来，如下所示：

const[item，setItem]=React.useState（[{title:“Food_item_1”}，{title:“Food_item_2”），…]）

代码当前没有将选中的食物名称保存到item const中。我需要这些名称以可用的格式过滤掉食物评论列表（在data const中）通过将标题与钩子中的一个食物名称匹配的评论放入Filteredata，并呈现Filteredata。Filteredata函数似乎正在工作，但我还需要帮助调整它以使用钩子数据（即，现在它只检查一个项目，如何使它检查项目中的所有内容）

谢谢。

存储以下数据：

const[item，setItem]=React.useState（[{title:“Food_item_1”}，{title:“Food_item_2”），…]）；

您需要进行以下更改：

export default function CheckboxesTags() {
  const [item, setItem] = React.useState([]);

  const handleChange = (evt, options) => {
    evt.persist();
    const lastAddedItem = options[options.length -1];
    setItem([...item, {title: lastAddedItem.item}]);
  };


  const filteredData = data.filter(menuitem => {
    return menuitem.title === item.title;
  });

  return (
    <Autocomplete
      multiple
      id="checkboxes-tags-demo"
      options={MENU}
      disableCloseOnSelect
      getOptionLabel={option => option.item}
      renderOption={(option, { selected }) => (
        <React.Fragment>
          <Checkbox
            icon={icon}
            checkedIcon={checkedIcon}
            style={{ marginRight: 8 }}
            checked={selected}
          />
          {option.item}
        </React.Fragment>
      )}
      style={{ width: 500 }}
      onChange={(e, options)=>{handleChange(e, options)}}
      renderInput={params => (
        <TextField
          {...params}
          variant="outlined"
          label="Menu"
          placeholder="Item"
          fullWidth
        />
      )}
    />
  );
}

导出默认函数CheckboxesTags（）{
const[item，setItem]=React.useState（[]）；
常量handleChange=（evt，选项）=>{
evt.persist（）；
const lastAddedItem=options[options.length-1]；
setItem（[…项，{title:lastAddedItem.item}]）；
};
常量filteredData=data.filter（menuitem=>{
返回menuitem.title==item.title；
});
返回(
option.item}
渲染={（选项，{selected}）=>(
{option.item}
)}
样式={{宽度：500}
onChange={（e，选项）=>{handleChange（e，选项）}
renderInput={params=>(
)}
/>
);
}

此处

options

作为参数传递给handleChange函数，该函数是一个包含所有选中项的数组。因此，我们将从该数组中提取最后一个选中项，并将其附加到setItem hook管理的项数组中