问题一:IOS transform rotate后文字无法显示
网上搜到可以用backface-visibility:hidden来解决,这样做文字是出来了,但是click事件无效了。
问题二:backface-visibility导致@click事件失效
在Vue中使用backface-visibility和@click可能会造成冲突,因为backface-visibility会影响元素背面的可见性,而@click是用来绑定点击事件的。当元素被旋转后,背面不可见时,点击事件可能无法触发。
为了解决这个问题,你可以尝试以下方法:
使用透明度(opacity)代替backface-visibility:
改用透明度来隐藏背面元素,而不是使用backface-visibility。
.element {
transform: rotateY(180deg);
opacity: 0.999; /* 或者一个极接近于1的值 */
}
通过将元素的透明度设置为一个极接近于1的值,而非1本身,来“隐藏”背面元素。这样可以保持背面元素不可见的同时,保持点击事件的可触发性。