uni小程序上传图片,兼容安卓机不会自动弹出相机选项的写法

原本是用的没有设置 itemList: ["拍照", "选择本地相册"],但是在安卓手机中点击图标不能弹出下图2,而是直接打开了手机相册,所以需要自己写一个数组展示

image.png
image.png

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);
              },
            },
          });
        },
    

    下图是图片展示和预览


    image.png
    image.png

    你可能感兴趣的:(uni小程序上传图片,兼容安卓机不会自动弹出相机选项的写法)