个人备案网站名称大全,网站开发不用mvc行不行,flex做的网站,淮北人论坛招聘信息学习目标#xff1a;
学习目标如下#xff1a;
例如#xff1a; uniapp 中 的progress加载进度条 的使用#xff0c;在 页面显示数据加载的进度条#xff0c;使用户的使用体验效果更好 学习内容#xff1a;
学习内容如下所示#xff1a; 相关属性的说明 进度条的显…学习目标
学习目标如下
例如 uniapp 中 的progress加载进度条 的使用在 页面显示数据加载的进度条使用户的使用体验效果更好 学习内容
学习内容如下所示 相关属性的说明 进度条的显示
view v-showprogressVisible classprogress-boxprogress :percentpercent show-info stroke-width4 //view是否显示属性的控制
progressVisible: false,显示进度条
that.progressVisible true进度条的样式设置
.progress-box {display: flex;height: 50rpx;margin-bottom: 60rpx;}知识总结
提示这里统计学习计划的总量 1、进度条的显示 及 相关属性的设置
view classprogress-boxprogress :percentpercent //百分比show-info //在进度条右侧显示百分比activetrue //进度条从左往右的动画active-modeforwards //动画从上次结束点接着播:stroke-width3 //进度条线的宽度单位为 pxbackgroundColor#F5F5F5 //未选择的进度条的颜色//view2、定义相关变量
data() {return {percent:0 //百分比0~100}},3、调用的方法
methods: {change(){// 开启定时器定时器同样可以用在请求当中let clearInt setInterval((){this.percent ;if(this.percent 100){clearInterval(clearInt)uni.showToast({title: 加载成功,con: success});}},30)}
}4、直接调用方法即可若想让进入页面自动调用该方法则直接在 onLoad 中调用该方法即可。 onLoad() {this.change()}样式的设置
.progress-box {display: flex;height: 50rpx;margin-bottom: 60rpx;}
