简介
qj-mobile-uploader是一款基于HTML5和JavaScript的移动端上传控件，可以支持多文件上传、文件类型限制、文件大小限制、文件预览、各种回调函数等功能。
安装
在使用之前，需要先安装该npm包，可以通过以下命令进行安装：
npm install qj-mobile-uploader --save
使用
基本用法
-- -------------------- ---- -------
------ ---------------- ---- --------------------
----- -------- - --- ------------------
----- -
--- ----------
--------- ----
--
--------- -
---- ---
--
------- ---------
--
------------------------- ------ -- -
-------------------------- -----
--
----------------------------- ------ ----------- -- -
------------------------------ ----- -----------
--
---------------------------- ------ --------- -- -
----------------------------- ----- ---------
--
-------------------------- ------ ------- -- -
--------------------------- ----- -------
--
----------------------------- ------ -- -
------------------------------ -----
--配置选项
pick：指定选择文件的按钮容器，可以是一个 DOM 元素，也可以是一个 CSS 选择器。该选项支持一个id属性，以此来绑定 DOM 元素。该选项还支持multiple属性，如果设为true，则可以选择多个文件。默认值为undefined。formData：上传文件附加的额外数据，该选项需要符合键值对的json格式。默认值为{}。server：文件上传的地址，可以是一个绝对地址或者相对地址。默认值为''。duplicate：是否允许重复上传相同的文件。默认值为false。fileNumLimit：限制文件上传的数量，如果超过限制，则自动终止上传。默认值为undefined。fileSingleSizeLimit：限制每个文件上传的最大大小，如果超过限制，则自动终止上传。默认值为undefined。fileAccept：限制文件上传的类型，可以是一个或多个文件类型，用逗号隔开。默认值为undefined。autoUpload：是否在文件添加之后自动上传。默认值为true。
回调函数
fileQueued：当文件被加入队列后触发。该回调函数包含一个参数file，表示该文件的详细信息。uploadProgress：当文件正在上传中时触发，会多次调用。该回调函数包含两个参数file和percentage，分别表示上传文件的详细信息和上传进度百分比。uploadSuccess：当文件上传成功时触发。该回调函数包含两个参数file和response，分别表示上传文件的详细信息和服务器返回的响应。uploadError：当文件上传出错时触发。该回调函数包含两个参数file和reason，分别表示上传文件的详细信息和出错的原因。uploadComplete：当文件上传完成后触发。该回调函数包含一个参数file，表示上传文件的详细信息。
示例
下面是一个使用示例：
-- -------------------- ---- -------
--------- -----
----- ----------
------
----- ----------------
-----------------------------------
-------
------
---- -------------
---- --------------
---- ----------------------
------
------
------- ----------------------------------------------------------------------------
--------
----- -------- - --- ------------------
----- -
--- ----------
--------- ----
--
--------- -
---- ---
--
------- ---------
--
------------------------- ------ -- -
-------------------------- -----
--
----------------------------- ------ ----------- -- -
------------------------------ ----- -----------
--
---------------------------- ------ --------- -- -
----------------------------- ----- ---------
--
-------------------------- ------ ------- -- -
--------------------------- ----- -------
--
----------------------------- ------ -- -
------------------------------ -----
--
---------
-------
-------总结
通过该教程，我们可以快速上手使用npm包 qj-mobile-uploader，它是一款非常强大且适用于移动端的上传控件，并且支持多文件上传、文件类型限制、文件大小限制、文件预览和各种回调函数等功能，对于前端开发人员来说是非常有帮助和指导意义的。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056cf481e8991b448e6ab8