1 <template>
2 <view>
3 <progress :percent="percent" strock-width="10"></progress>
4 <button type="primary" @tap="cI">chooseImg</button>
5 </view>
6 </template>
7
8 <script>
9 // 注册一个进度条
10 var _self;
11
12 export default {
13 data() {
14 return {
15 percent:0
16 }
17 },
18 onLoad() {
19 _self = this;
20 },
21 methods: {
22 // cI(){
23 // uni.chooseImage({
24 // count: 1,
25 // sizetype: ['compressed'],
26 // success(res){
27 // // tepFliePaths 保存图片路径
28 // var imgFiles = res.tempFilePaths;
29 // // 因为没写下标, 直接以数组形式输出
30 // console.log(imgFiles)
31 // }
32 // })
33 // }
34 cI:function(){
35 uni.chooseImage({
36 count: 1,
37 sizeType:['copressed'],
38 success(res) {
39 //因为有一张图片, 输出下标[0], 直接输出地址
40 var imgFiles = res.tempFilePaths[0]
41 console.log(imgFiles)
42 // 上传图片
43 // 做成一个上传对象
44 var uper = uni.uploadFile({
45 // 需要上传的地址
46 url:'http://demo.hcoder.net/index.php?c=uperTest',
47 // filePath 需要上传的文件
48 filePath: imgFiles,
49 name: 'file',
50 success(res1) {
51 // 显示上传信息
52 console.log(res1)
53 }
54 });
55 // onProgressUpdate 上传对象更新的方法
56 uper.onProgressUpdate(function(res){
57 // 进度条等于 上传到的进度
58 _self.percent = res.progress
59 console.log('上传进度' + res.progress)
60 console.log('已经上传的数据长度' + res.totalBytesSent)
61 console.log('预期需要上传的数据总长度' + res.totalBytesExpectedToSend)
62 })
63 }
64 })
65 }
66 }
67 }
68 </script>
69
70 <style>
71
72 </style>