时间戳

首页 > 解决方案 > 我可以在函数中调用 React Hook 吗？

reactjs - 我可以在函数中调用 React Hook 吗？

问题描述

我想更改state使用React Hook 并重定向到新页面，并在单击按钮后将更改的状态传递给其他组件。所以我做了：

const MovieCard = (props) => {
  const [movie, setMovie] = useState({})
  
  function handleClick(movie) {
    setMovie(movie)
    props.history.push({
       pathname: '/otherPage',
       data: movie
    })
  }
  
  return(
     ...
       <Button onClick={() => handleClick(props.movie)} />
     ...
  )
}

但是 Hook 没有更新状态。因为基于React Hook 文档，它的工作方式如下：

<Button onClick={() => setMovie(props.movie)} />

是否可以在函数内部调用钩子或者有什么方法可以做到这一点？

标签： reactjsreact-hooks

解决方案

可以执行您正在执行的操作，但是通过更改到另一个页面，您正在清除存储在该组件上的状态。您要么不需要重定向（我假设您不想这样做），要么您需要将该状态传递给您要重定向到的其他组件。

推荐阅读