多個效果嵌套問題,想實現(xiàn)平移的時候子元素同時有滾動效果
.numberBox{
position:relative;
width:72px;
height:24px;
.num-count{
position:absolute;
left:24px;
top:0;
input{
width:24px;
height:24px;
text-align:center;
}
}
.num-decrease{
position:absolute;
left:0;
top:0;
font-size:24px;
color:#00A0DC;
}
.num-add{
position:absolute;
right:0;
top:0;
font-size:24px;
color:#00A0DC;
}
}
.move-enter,.move-leave-to{
opacity:0;
transform: translateX(24px);
.num-decrease{
transform: rotate(0);
}
}
.move-enter-active,.move-leave-active{
transition: all 0.5s linear;
.num-decrease{
transition: all 0.5s linear;
}
}
.move-enter-to,.move-leave {
opacity: 1;
transform: translateX(0);
.num-decrease {
transform: rotate(180deg);
}
}
發(fā)現(xiàn)只有enter的時候有效果,leave的時候沒有旋轉(zhuǎn)效果,不知道為什么?
將0 和180deg 分別改為 180deg 和 360deg 就正常了,不明白為什么?