Javascript React 16.13:无法从子事件处理程序中不同组件的函数体内部更新组件

我正在使用React 16.13，我不了解解决此警告的解决方法。我正在从子组件的事件处理程序调用setState函数，这意味着setState没有在render上运行。我认为根据文件，这应该是允许的

有人知道我是如何做到这一点的吗？我正试图用一种很好的方式来阻止React在这里试图阻止的事情？ 代码沙盒链接：

在一个注释的请求下，我也将代码放在这里。注意，ant的版本是3.24.1，但所有Antd<4的版本都是如此。当你输入单词cat时，每个连续的字母都会触发对我的警告。请原谅我没有包括CSS的难看的格式

import React, { useState } from "react";

import { Select } from "antd";
const { Option } = Select;

export const getSelectOptions = options => {
  if (!Array.isArray(options) || options.length === 0) {
    return undefined;
  }

  return options.map(opt => {
    return <Option key={opt}>{opt}</Option>;
  });
};

const SelectWithSearchFilter = props => {
  const { value, data } = props;

  const [filteredList, setFilteredList] = useState([]);

  const handleSearch = searchTerm => {
    console.log(searchTerm);
    if (searchTerm.length < 1) {
      setFilteredList([]);
    } else {
      const newFilteredList = data.filter(item =>
        item.toLowerCase().includes(searchTerm.toLowerCase())
      );
      setFilteredList(newFilteredList);
    }
  };

  return (
    <Select
      value={value}
      showSearch={true}
      size="default"
      // loading={loading}
      // onChange={onChange}
      placeholder="enter something"
      onSearch={handleSearch}
      // mode={mode}
      // allowClear={allowClear}
    >
      {getSelectOptions(filteredList)}
    </Select>
  );
};

const App = () => {
  return (
    <div>
      <SelectWithSearchFilter
        value="alligator"
        data={[
          "alligator",
          "bird",
          "cat",
          "cat2",
          "cat3",
          "dog",
          "cow",
          "monkey"
        ]}
      />
    </div>
  );
};
export default App;

---

你能把相关代码贴在这里吗？我在你的沙盒上得到的错误与你在问题中所说的不同你得到的错误是什么？我会在稍后添加代码。因此，我确实认识到，首先还有一些其他警告，但这些警告与此无关，并且是独立处理的。请将相关代码发布在此处？我在你的沙盒上得到的错误与你在问题中所说的不同你得到的错误是什么？我会在稍后添加代码，我确实认识到，首先还有一些其他警告，但这些警告与此无关，并且独立于此进行处理。