如果状态为空，如何清除 React Material AutoComplete 选定的标签？答案

【问题标题】：How can clear React Material AutoComplete selected label clear if state empty?如果状态为空，如何清除 React Material AutoComplete 选定的标签？
【发布时间】：2021-07-12 04:04:19
【问题描述】：

我有一个状态：

  const [searchEntryNo, setSearchEntryNo] = useState('');

然后我有一个像这样清除状态的功能。

  const handleClear = () => {
    setSearchEntryNo('');
  };

然后是 React AutoComplete ：

           <Autocomplete
              className={classes.searchBox}
              id="combo-box-demo"
              size="small"
              options={entryList}
              getOptionLabel={(option) => option}
              onChange={(event, newValue) => {
                setSearchEntryNo(newValue);
              }}
              style={{ width: 300 }}
              renderInput={(params) => <TextField {...params} variant="outlined" 
                      placeholder="Searching" size="small" />}
            />

注意：entryList 是一个数组状态

有一个按钮，其中 handleClear() 函数触发了按钮点击：

<Button onClick={handleClear}> Clear </Button>

现在我想在 handleClear() 触发后从自动完成框中清除选定的标签。我该如何解决这个问题？ 请帮帮我！！

【问题讨论】：

标签： javascript reactjs react-material

【解决方案1】：

onChange 还将第二个参数传递给更改处理程序：docs

onChange={(_, value: any, reason: string) => {
 if (value) {
    // seState
 }
if (reason === "clear") {
    // clear State
 }
}}

【讨论】：