EL

  事先声明,本人系.net后端老菜鸟,vue接触没有多长时间,如果存在技术分享错误,切莫见怪,第一次写博,还请大佬们多多担待,转载请注明出处谢谢!

  最近项目用到饿了么上传,于是参照官网接入el-upload发现无进度条停顿了一下直接显示上传成功有些不友好,on-progress方法也无法触发,百度了下大概是mockjs引入的问题,注释就好了,一般情况下是没有问题。

但本人后面才接手的项目,项目里已经很多地方有存在引用mockjs,导致我按照百度注释mock引入后,vue界面打不开的问题

  

  F12看下js报错

  具体原因我也没有细查,大概是其它地方有引用mock,单纯注释会导致报错,当然如果你有耐心去查项目哪些地方引用了然后修改再来注释也可以

  如果你不想修改原来已经写好的部分,可以参考下本人的解决方案

  因为upload自带的进度条无法使用了,所以我们可以在el-upload后面加上el-progress进度条,on-progress无法使用我们可以用on-change函数替代具体如下:

初始化两个属性值,showProcess用于显示进度条,processLenghth用于显示进度条的百分比

  on-change函数在上传开始、上传成功、上传失败均会调用,调试参数file发现上传开始file属性status值为ready,上传成功status的值为sucess,因此我们对这两种状态进行处理(注:正常情况下on-progress函数的file参数有个进度百分比的属性值可以直接使用)

  在上传开始的时候写个计时器,百分比重置为0,调用频率各位自行设定,计时器中对百分比进行累加,达到99停止累加
  在上传成功的时候计进度条百分比设为100表示已上传完成,然后设置showProcess属性值为false隐藏进度条,效果如下:

  OK,搞定,虽然不是真实的监控上传进度,但对于用户相对比较友好一点

  第一次写博,有些地方有错误请指出谢谢,转载请注明出处,对于文字功底差的我完整写一篇不容易,谢谢!

点赞
收藏

评论区

加载中...

相关推荐

MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1

文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s

Oracle 分组与拼接字符串同时使用

SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(

MySQL部分从库上面因为大量的临时表tmp_table造成慢查询

背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_

手写Java HashMap源码

HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22

2020年前端实用代码段,为你的工作保驾护航

有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )

mysql设置时区

mysql设置时区mysql\_query("SETtime\_zone'8:00'")ordie('时区设置失败,请联系管理员!');中国在东8区所以加8方法二:selectcount(user\_id)asdevice,CONVERT\_TZ(FROM\_UNIXTIME(reg\_time),'08:00','0