原本是用的没有设置 itemList: ["拍照", "选择本地相册"],但是在安卓手机中点击图标不能弹出下图2,而是直接打开了手机相册,所以需要自己写一个数组展示
index.vue//[点击相机图片弹出拍照和选择本地相册的弹框,去选择/上传成功展示图片]
//点击调用弹框 ["拍照", "选择本地相册"],上传本地图片
chooseImg(file) {
var that = this;
wx.showActionSheet({
itemList: ["拍照", "选择本地相册"],
itemColor: "",
//成功时回调
success: function(res) {
if (!res.cancel) {
if (res.tapIndex == 0) {
that.chooseImage1(0);
} else if (res.tapIndex == 1) {
that.chooseImage1(1);
}
}
},
//失败时回调
fail: function(res) {
console.log("调用失败");
},
});
},
chooseImage1(tapIndex) {
var that = this;
wx.chooseImage({
count: 1, //一次只能选择单张
sizeType: ["original", "compressed"],
sourceType: [that.sourceType[tapIndex]],
success: function(res) {
// 预览图片
const tempFilePaths = res.tempFilePaths[0];
that.show1 = true;
uni.uploadFile({
url: "http://**/upload", //测试//这里写的是http访问地址+upload上传图片的接口
filePath: tempFilePaths, // uni.chooseImage函数调用后获取的本地文件路劲
name: "file", //后端通过'file'获取上传的文件对象
header: {
"Content-Type": "multipart/form-data",
},
success: (res) => {
var data = JSON.parse(res.data);
const { fileList = [] } = res.data;
fileList.push({
url: JSON.parse(res.data).data,
deletable: true,
});
if (that.fileList.length >= 3) {//数组最多选择三张
uni.showToast({
title: "提交图片不超过3张",
icon: "none",
});
return;
}
for (let i in fileList) {
that.fileList.push(fileList[i]);
}
},
});
},
});
},
//点击图片预览
preview(item) {//d点击图片预览
uni.previewImage({
urls: [item.url], //拿vuex中的头像地址
longPressActions: {
itemList: ["发送给朋友", "保存图片", "收藏"],
success: function(data) {
console.log(
"选中了第" +
(data.tapIndex + 1) +
"个按钮,第" +
(data.index + 1) +
"张图片"
);
},
fail: function(err) {
console.log(err.errMsg);
},
},
});
},
下图是图片展示和预览