一种基于vue的文件上传组件的二次封装方法和装置制造方法及图纸

本发明专利技术提供了一种基于vue的文件上传组件的二次封装方法和装置，解决了针对于文件上传功能的开发步骤繁琐，复杂，且上传功能的第三方组件无法完全满足业务需求的问题。该基于vue的文件上传组件的二次封装方法包括：在vue页面中创建el‑upload组件和el‑progress组件；基于所述el‑upload组件获取目标上传文件的大小，并判断所述目标上传文件的大小是否符合上传标准；若是，上传所述目标上传文件，并基于所述el‑progress组件获取上传进度；上传完成后，对上传的所述目标上传文件进行预处理并存储；对存储的所述目标上传文件进行封装，并获得vue组件。

【技术实现步骤摘要】

本专利技术涉及vue前端，具体涉及一种基于vue的文件上传组件的二次封装方法和装置。

技术介绍

1、随着互联网的发展，文件上传已成为许多网站和应用程序中必不可少的功能之一。目前，大多数文件上传功能使用传统的表单提交方式，这种方式步骤较为繁琐，不便于开发。作为一种组件化开发的前端框架，vue越来越受到前端开发者的欢迎，组件化带来了良好的代码复用，使得开发的代码量大大减少，但在业务需求中对于文件上传功能的各类第三方组件往往与需求不符，需要进行自定义上传的形式来满足业务需求。

技术实现思路

1、有鉴于此，本专利技术提供了一种基于vue的文件上传组件的二次封装方法和装置，解决了针对于文件上传功能的开发步骤繁琐，复杂，且上传功能的第三方组件无法完全满足业务需求的问题。

2、第一方面，本专利技术一实施例提供的一种基于vue的文件上传组件的二次封装方法包括：

3、在vue页面中创建el-upload组件和el-progress组件；

4、基于所述el-upload组件获取目标上传文件的大本文档来自技高网...

【技术保护点】

1.一种基于vue的文件上传组件的二次封装方法，其特征在于，包括：

2.根据权利要求1所述的基于vue的文件上传组件的封装方法，其特征在于，所述在vue页面中创建el-upload组件，包括：在vue页面中引入el-upload组件，并在所述el-upload组件中的:http-request:属性中创建自定义上传方法。

3.根据权利要求1所述的基于vue的文件上传组件的封装方法，其特征在于，在vue页面中创建el-progress组件，包括：在vue页面中引入el-progress组件，并将代表进度数值的变量绑定在所述el-progress组件中的:percen...

【技术特征摘要】

1.一种基于vue的文件上传组件的二次封装方法，其特征在于，包括：

2.根据权利要求1所述的基于vue的文件上传组件的封装方法，其特征在于，所述在vue页面中创建el-upload组件，包括：在vue页面中引入el-upload组件，并在所述el-upload组件中的:http-request:属性中创建自定义上传方法。

3.根据权利要求1所述的基于vue的文件上传组件的封装方法，其特征在于，在vue页面中创建el-progress组件，包括：在vue页面中引入el-progress组件，并将代表进度数值的变量绑定在所述el-progress组件中的:percentage属性下。

4.根据权利要求1所述的基于vue的文件上传组件的封装方法，其特征在于，所述基于所述el-progress组件获取上传进度，包括：基于progressevent方法获取上传进度，并基于获取到的上传进度得到上传进度百分比。

5.根据权利要求1所述的基于vue的文件上传组件的封装方法，其特征在于，所述对上传的所述目标上传文件进行预处理并...

【专利技术属性】
技术研发人员：汪忠德，杨文广，
申请(专利权)人：中国石油化工股份有限公司，
类型：发明
国别省市：