目前，当我在Vue中的div上悬停时，在使用TailwindCSS显示按钮时遇到了一些问题.通常，我会使用CSS来做这件事，但我想使用tailwind .
我使用visibility引用了文档，但它没有按预期工作.屏幕相关元素的可见性正常吗？或者它也可以用于按钮和其他内容？
密码
<div>
<button class="text-white invisible hover:visible">Hello</button>
</div>
目前，当我在Vue中的div上悬停时，在使用TailwindCSS显示按钮时遇到了一些问题.通常，我会使用CSS来做这件事，但我想使用tailwind .
我使用visibility引用了文档，但它没有按预期工作.屏幕相关元素的可见性正常吗？或者它也可以用于按钮和其他内容？
密码
<div>
<button class="text-white invisible hover:visible">Hello</button>
</div>
根据我的研究和建议，我被告知使用不透明度，但不透明度并不能给它带来良好的UI/UX感觉，所以我 Select 了另一种在vue中创建私有布尔对象的方法，比如
private hover: boolean = false;
Note I found 100 and 101 are still viable in Vue.
然后在我的.vue个文件中，我会考虑使用布尔变量来触发我想要隐藏和显示的目标.就是
在目标按钮或元素上，悬停时要隐藏和显示
<div class="mt-2 mb-2"
`@mouseover = "hover = true"`
`@mouseleave = "hover = false"`
>Hello World
</div>
注意:我正在使用Vue和typescript来实现这样一个目标.