06-使用云储存上传工具

如何把图片视频文件上传到我们的uniCloud？

<image class="logo" :src="src"></image>

<view>
   <button type="default" @click="updateFn">上传</button>
   <button type="default" @click="deleteFn">删除图片</button>
</view>

// 上传图片
            updateFn(){
                let _this = this;
                // 选择图片上传的API
                uni.chooseImage({
                    // 最多允许一块选几张图片
                    count:1,
                    success(res) {
                        // res里面包含了上传图片的信息
                        const tempFilePath = res.tempFilePaths[0];
                        const fileName = res.tempFiles[0].name;
                        // console.log(res,"用户选择的图片信息~")  // blob:http://localhost:8080/7a0e5269-dde5-4fb7-a9b2-29822fe9e1f3
                        // 拿到用户选择的要上传的图片路径信息和文件名（这两个是必填项）传给服务器
                        uniCloud.uploadFile({
                            filePath:tempFilePath,
                            cloudPath:fileName,
                            success(res) {
                                console.log(res,'上传成功');
                                // 把上传图片后的图片赋值给了img的src，用于显示
                                _this.src =  res.fileID
                            },
                            fail(err) {
                                console.log(err);
                            }
                        })
                    },
                    fail(err){
                        console.log(err)
                    }
                })
            },

点击上传选择本地图片后显示在img标签中。

 

删除某些图片：

    // 删除图片
            deleteFn(){
                uniCloud.deleteFile({
                    // 把要删除的图片id（在云存储中的id）放入到fileList数组中
                    fileList:['543d26c0-c1ab-4bf5-93f2-a030f8e50e00'],
                    success(res) {
                        console.log(res,'删除成功')
                    },fail(err) {
                        console.log(err)
                    }
                })
            },

在云存储中可以看到图片上传的信息