uniapp做開發區別於H5開發,不能使用js進行dom操作,只能獲取dom信息。
(獲取dom信息參考:https://www.cnblogs.com/huihuihero/p/12966528.html )
不能操作dom,這使得通過操作dom來實現一些簡單的動畫效果變得困難
不過有一個很簡單的思路:
定義不同的class,每個class對應一種樣式,加一個transition過渡。然后通過更換節點的class即可實現兩種樣式過渡(動畫)
示例(展示思路用)
<view :class="isLarge?'yesLarge':'notLarge'" @tap="toggleSize"></view>
toggleSize(){
this.isLarge=!this.isLarge
}
.yesLarge{
width: 200rpx;
height: 200rpx;
background-color: #a1a1a1;
transition: all .5s;
}
.notLarge{
width: 40rpx;
height: 40rpx;
background-color: #0169b1;
transition: all .5s;
}