react-bootstrap 在禁用/启用后失去焦点

问题描述 投票:0回答:0

我无法使用 react-bootstrap FormControl 获得输入以保持焦点。似乎禁用,然后启用控件会删除焦点。这是一个不受控制的输入,但与受控输入有同样的问题。 JS小提琴在这里

const SearchInput = ({onChange, ...props}) => {
  return (
    <Form
      onSubmit={evt => {
        evt.preventDefault();
        onChange();
      }}
    >
      <Form.Control {...props} />
    </Form>
  );
};

const App = (props) => {
  const [search,setSearch] = useState();
  const [searching, setSearching] = useState(false);
  const handleSearch = () => {
    setSearching(true);
    setTimeout(() => {
      setSearching(false)
    }, 2000);
  };
 return (
  <div>
    <SearchInput
      autoFocus
      disabled={searching} /* if this line is removed, focus remains */
      defaultValue={search}
      onChange={handleSearch}
    />
    <div>{search}</div>
  </div>
);
javascript reactjs dom
© www.soinside.com 2019 - 2024. All rights reserved.