我想创建一组过滤器来暂停或播放我的视频。我的实现如下所示：

const Player = () => {
  const playFilters = [useIsPageVisible(), useIsInViewport(videoElement)];
  const player = useInitPlayer();

  useEffect(() => {
    if (player) {
      if (playFilters.every((filter) => filter)) {
        player.play()
      } else {
        player.pause()
      }
    }
  }, [player, playFilters])

return <Player player={player}/>
}

我知道在 if 条件中定义钩子是不对的。但是如何像上面那样定义它们呢？有没有更好的方法？