本文介绍了一种在VUE项目中通过改变变量值来控制CSS样式的切换方法，利用这种方式可以实现图标旋转等效果。具体是通过设置变量abc的true或false值来决定是否应用.iconTrans类，从而实现图标旋转180度。
<span :class="{icon: true, iconTrans:abc}"></span>.icon {
position: absolute;
top: 18px;
right: 10px;
width: 8px;
height: 6px;
background-image: url("../../assets/img/icon-tkxl.png");
background-repeat: no-repeat;
-webkit-transition: transform .25s linear;
-moz-transition: transform .25s linear;
-o-transition: transform .25s linear;
transition: transform .25s linear;
}
.iconTrans {
transform: rotate(180deg);
-webkit-transition: transform .25s linear;
-moz-transition: transform .25s linear;
-o-transition: transform .25s linear;
transition: transform .25s linear;
}通过对变量abc为true或false的控制实现css的切换
这是VUE的写法，等有时间整理，作为自用代码
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
