如何让同一个状态响应多个"elements"？
How to make the same state respond to multiple "elements"?
我有一个容器，其中包含可变数量的元素。我想要实现的是无论悬停在哪个元素上，都应该显示悬停内容。但是使用当前代码，无论您将鼠标悬停在哪一个上，所有这些都会同时显示。有没有一种解决方案，只让您悬停的内容可见，而不使用多个状态。
这里是代码的沙盒：https://codesandbox.io/embed/mystifying-sun-g4yjg?fontsize=14&hidenavigation=1&theme=dark
提前致谢！
当状态处于父状态时，您无法区分悬停在哪个项目上。为您的 HoverBox 创建一个单独的子组件并将状态移入其中（这样每个框都会保持其自己的悬停状态）。
这是一个沙盒：
https://codesandbox.io/s/charming-rain-rhf73?file=/src/HoverBox.js
我有一个容器，其中包含可变数量的元素。我想要实现的是无论悬停在哪个元素上，都应该显示悬停内容。但是使用当前代码，无论您将鼠标悬停在哪一个上，所有这些都会同时显示。有没有一种解决方案，只让您悬停的内容可见，而不使用多个状态。
这里是代码的沙盒：https://codesandbox.io/embed/mystifying-sun-g4yjg?fontsize=14&hidenavigation=1&theme=dark
提前致谢！
当状态处于父状态时，您无法区分悬停在哪个项目上。为您的 HoverBox 创建一个单独的子组件并将状态移入其中（这样每个框都会保持其自己的悬停状态）。
这是一个沙盒：
https://codesandbox.io/s/charming-rain-rhf73?file=/src/HoverBox.js