背景
<view class="cu-load bg-blue" :class="!isLoad?'loading':'over'"></view>
加载状态
<view class="cu-load bg-grey" :class="!isLoad?'loading':'over'"></view>
加载错误
弹框加载
<view class="cu-load load-modal" v-if="loadModal">
<!-- <view class="cuIcon-emojifill text-orange"></view> -->
<image src="/static/logo.png" mode="aspectFit"></image>
<view class="gray-text">加载中...</view>
</view>
进度条加载
<view class="load-progress" :class="loadProgress!=0?'show':'hide'" :style="[{top:CustomBar+'px'}]">
<view class="load-progress-bar bg-green" :style="[{transform: 'translate3d(-' + (100-loadProgress) + '%, 0px, 0px)'}]"></view>
<view class="load-progress-spinner text-green"></view>
</view>
LoadProgress(e) {
this.loadProgress = this.loadProgress + 3;
if (this.loadProgress < 100) {
setTimeout(() => {
this.LoadProgress();
}, 100)
} else {
this.loadProgress = 0;
}
}