一、展示效果
二、只写下核心的代码,样式自己弄下就好了。点击图片调用 add_img方法()
// 点击调用手机相册/拍照
add_img: function (type) {
let that = this;
wx.chooseImage({
count: 1,//一张图片
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],//手机拍照/图片
success: function (res) {
let src = res.tempFilePaths[0];
let local_img = src; //本地选择图片地址(可以用来展示,后面上传服务器成功再替换成服务器图片路径,不替换也行,避免参数相同即可)
that.setData({
local_img:src
});
that.uploadFile(src);
}
},
fail: function () {
wx.showToast({
title: '图片上传失败',
icon: 'none'
})
return;
}
})
},
uploadFile(src){ //将图片上传到服务器
let _this = this;
let filePath = src;
wx.uploadFile({
url: api.Upload_Desc_Img,
filePath: filePath,
formData: null,
name: 'file',
header: {
'X-Requested-With': 'XMLHttpRequest',
'Authorization': wx.getStorageSync('token'),//根据后台需要参数
'Appid': wx.getStorageSync('appid')//根据后台需要参数
},
success: (res => {
let data = JSON.parse(res.data);
if (data.code === 200) {
let ftp_save_file_path = data.data.img_url;//服务器返回图片地址
_this.setData({
local_img:ftp_save_file_path ,
})
}
})
})
return false;
},
只介绍图片上传的方法,视频上传的方法和图片上传的方法类似,就不一一说明啦,不懂的话可以私聊我。