我在React应用程序中使用bootstrap datatable

function MyApp(){

const tableRef = useRef(null);
const [tableSave, setTableSave] = useState(null)
const [dataFromAPI, setDataFromAPI] = useState([])

useEffect(()=> {
      axios.get("url").then(response=>setDataFromAPI(response.data))
},[])
 
useEffect(() => {
    
   setTableSave($(tableRef.current).DataTable(
      {
        bSort: false,
        scrollY: "200px",
        scrollCollapse: true,
        info: true,
        paging: false
      }
    ));
   
  }, [dataFromAPI]);
return (
<>
 <table className="table" ref={tableRef}>
            <thead>
              <tr>
                <th>A</th>
                <th>B</th>
                <th>C</th>
              </tr>
            </thead>
            <tbody>
              {tableData.map((_value, i) => {
                return (
                  <tr key={i}>
                    <td key={i}>{_value['A']}</td>
                    <td key={i}>{_value['B']}</td>
                    <td key={i}>{_value['C']}</td>
                  </tr>
                );
              })}
            </tbody>
          </table>
</>
)
}

现在的数据是正确的显示和搜索工作也很完美，但我希望当用户输入搜索和过滤表记录的数组。我不知道在处理react应用程序时，Bootstrap Datatable中调用了哪个方法。例如，当用户在搜索框中输入'A'时，应调用该方法并返回一个数组，其中任何列中的对象都具有'A'值。如何通过保留数据表特性来实现这一点？