我在RubyonRails项目中使用react，发现了错误 Uncaught Error: Invalid hook call. 我用的是宝石 react-on-rails . 我的组件代码：

const DimaSearch = () => {
  const [searchObject, setSearchObject] = useState("")
  useEffect(() => {
    fetch(
      `/api/v1/search_objects?search=${searchObject}`
    )
      .then((response) => response.json())
      .then((data) => {
        console.log(data);
      });
  }, [searchObject]);
  const handleOnChange = (event) => {
    event.preventDefault()
    setSearchObject(event.target.value)
  }
  return (
    <div className="container justify-content-center">
      <div className="row">
        <div className="col-md-8">
            <div className="input-group mb-3">
              <input 
              type="text" 
              className="form-control input-text"
              placeholder="Search..."
              onChange={(event) => handleOnChange(event)}
              />
            <div className="input-group-append">
              <button className="btn btn-outline-primary btn-lg" type="button">
                <i className="fa fa-search"></i>
              </button>
            </div>
            </div>
        </div>
      </div>
    </div>
  )
}
export default DimaSearch

index.html.slim，其中我导入组件：

= react_component("DimaSearch")

我已经读过关于钩子用法的书，真的不知道该怎么办。