前端本地上传文件进度条显示，使用vuex在不同组件均可以显示

本地文件上传自己主要是使用了vue+axios来完成，网上有很多方法，大同小异，借鉴了已经封装好的直接使用就行，我现在主要是想总结如何在不同的组件显示文件的上传进度，主要使用vuex,走过的坑不想再走一遍。

首先是点击事件@change=handleLocalFile，里面第一个dispatch是上传文件的（这个简单无需过度关注），第二个是上传进度的

 

接下来是在vuex中的方法，网上很多，直接拿来用就行了，也可以自己封装一个，需要注意参数的传递，传递两个参数的时候要用{}

 

 

 

 

最后，需要注意的是这个进度显示，主要是修改样式的宽度，大家别忘记了在vuex中的state中定义uploadStyle和uoloadRate,如果想要在其他组件中使用，直接在该使用组件中的computed中传递就行啦!

 

 

 

 

0人点赞

 

日记本