React/JSX/NextJS 中有没有一种方法可以在单击 gif 时自动全屏打开视频？
Is there a way in React/JSX/NextJS to have a video auto open in fullscreen upon clicking a gif?
用例：我有一个客户希望在他们的主页上有一个 gif 版本的视频，点击该视频会打开一个全屏视频播放器。我该如何管理？我一直在 NextJS 框架中构建网站。
我想做类似 this 的事情，但不是自动播放 mp4，而是自动循环播放视频的 gif，点击 gif 后，全屏播放 mp4。
任何帮助将不胜感激 - 我从来没有真正搞砸过 React 中的视频。
我会创建一个反应状态并将其设置为 false
然后 gif 的 onClick 我会将状态更新为 true
然后有条件语句在状态变为 true
时全屏显示视频
并在视频从全屏移除时将状态设置回 false
没有一种方法可以做到这一点，但 React 的魅力在于组件。你绝对是在朝着正确的方向前进。我实际上会做两个独立的组件，一个用于背景，一个用于视频播放器。这是在代码中分离关注点的更清晰的良好做法。
简单地有条件地交换组件，就像这个简化的例子一样；
if(onclick) {
render (
<Player />
) else {
<Index />
}
}
你可以很好地使用状态来设置条件。 React 中唯一的问题是组件在技术上不共享状态，但另一方面，“后台组件”只需要知道它是否在前台以及是否接收到 onClick 事件。视频组件只需要知道它自己的 onClick 就可以再次消失。因此，在这种非常特殊的情况下，两个单独的事件处理程序不是问题。
用例：我有一个客户希望在他们的主页上有一个 gif 版本的视频，点击该视频会打开一个全屏视频播放器。我该如何管理？我一直在 NextJS 框架中构建网站。
我想做类似 this 的事情，但不是自动播放 mp4，而是自动循环播放视频的 gif，点击 gif 后，全屏播放 mp4。
任何帮助将不胜感激 - 我从来没有真正搞砸过 React 中的视频。
我会创建一个反应状态并将其设置为 false 然后 gif 的 onClick 我会将状态更新为 true 然后有条件语句在状态变为 true
时全屏显示视频并在视频从全屏移除时将状态设置回 false
没有一种方法可以做到这一点，但 React 的魅力在于组件。你绝对是在朝着正确的方向前进。我实际上会做两个独立的组件，一个用于背景，一个用于视频播放器。这是在代码中分离关注点的更清晰的良好做法。
简单地有条件地交换组件，就像这个简化的例子一样；
if(onclick) {
render (
<Player />
) else {
<Index />
}
}
你可以很好地使用状态来设置条件。 React 中唯一的问题是组件在技术上不共享状态，但另一方面，“后台组件”只需要知道它是否在前台以及是否接收到 onClick 事件。视频组件只需要知道它自己的 onClick 就可以再次消失。因此，在这种非常特殊的情况下，两个单独的事件处理程序不是问题。