使用uploader模块进行文件上传

来源于：http://www.hcoder.net/tutorials/info_108.html
Uploader模块管理网络上传任务，用于从本地上传各种文件到服务器，并支持跨域访问操作。
通过plus.uploader可获取上传管理对象。
Uploader上传使用HTTP的POST方式提交数据，数据格式符合Multipart/form-data规范，即rfc1867（Form-based File Upload in HTML）协议
 
html：
1 <span class="mui-pull-right head">
2     <img class="head-img mui-action-preview" id="head-img1" :src="headImgs" />
3 </span>

javascript

1 new Vue({
2 el: '#deInfo',
3 data: function() {
4 return {
5 headImgs: ''
6 }
7 },
 1 var task = null
 2 task = plus.uploader.createUpload( URL//上传图片的路径,
 3 {
 4 method: "POST",
 5 timeout: 5000
 6 },
 7 function(t, status) {
 8 var responseText = JSON.parse(t.responseText)
 9 if(status === 200) {
10  this.headImgs = responstText.img
11  mui.toast('图片修改成功’)
     } else {
12 mui.alert('error')
13 }
14 }
15 )
16 task.addFile(imgSrc //图片的路径, {
17 key: "file" //必须
18 })
19 
20 task.start()

效果图：

posted @ 2018-03-26 18:20  Anetye  阅读(530)  评论(0)  编辑  收藏  举报