uni-app uni.chooseImage 在微信电脑版网页点击无法弹出选择窗口

uni-app uni.chooseImage 在微信电脑版网页点击无法弹出选择窗口

开发环境 版本号 项目创建方式
Windows 11 HBuilderX

示例代码:

uni.chooseImage


## 操作步骤:

uni.chooseImage

预期结果:

可以弹出选择窗口


## 实际结果:

不可以弹出选择窗口

bug描述:

uni.chooseImage 微信电脑版网页点击无法弹出选择窗口
很奇怪的问题,有些人的微信电脑可以,有些人的电脑不行


更多关于uni-app uni.chooseImage 在微信电脑版网页点击无法弹出选择窗口的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复

量化

更多关于uni-app uni.chooseImage 在微信电脑版网页点击无法弹出选择窗口的实战教程也可以访问 https://www.itying.com/category-93-b0.html


啥意思啊兄弟

uni.chooseImage 在手机浏览器中无法在异步回调中拉起; 可以在异步完成后调用uni.showModal 然后在showModal的success回调中再去调用uni.chooseImage可以拉起成功。 解决的话点个感谢哦

另外一种解决方案
我们可以给一个无关的dom节点绑定一个click方法,在异步回调的时候 获取节点触发click事件 这时候会发现pc浏览器已经可以成功调用,但是手机端还是无法成功调起。我们可以给这个click方法加一个 延时器 就可以在手机端成功调起了

在微信电脑版网页中使用 uni.chooseImage 时,可能会遇到无法弹出选择窗口的问题。这通常是因为微信电脑版的环境限制或兼容性问题。以下是一些可能的解决方案和注意事项:

1. 检查微信版本

确保你使用的是最新版本的微信电脑版。旧版本可能存在兼容性问题,更新到最新版本可能会解决这个问题。

2. 使用 wx.chooseImage

如果你在微信环境中开发,可以尝试直接使用微信的 wx.chooseImage API,而不是 uni.chooseImagewx.chooseImage 是微信原生的 API,可能在微信电脑版中表现更好。

wx.chooseImage({
  count: 1, // 默认9
  sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
  sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
  success: function (res) {
    var tempFilePaths = res.tempFilePaths;
    // 这里可以处理选择的图片
  }
});

3. 使用 uni.chooseImage 的兼容性处理

如果你仍然希望使用 uni.chooseImage,可以尝试在代码中添加一些兼容性处理,确保在微信电脑版中也能正常工作。

uni.chooseImage({
  count: 1, // 默认9
  sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
  sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
  success: function (res) {
    var tempFilePaths = res.tempFilePaths;
    // 这里可以处理选择的图片
  },
  fail: function (err) {
    console.error('选择图片失败', err);
    // 在这里可以添加一些兼容性处理,比如提示用户使用手机端操作
  }
});

4. 提示用户使用手机端操作

如果以上方法都无法解决问题,可以在微信电脑版中提示用户使用手机端进行操作。微信电脑版的功能可能不如手机端全面,某些 API 在电脑版中可能无法正常工作。

if (uni.getSystemInfoSync().platform === 'windows' || uni.getSystemInfoSync().platform === 'mac') {
  uni.showModal({
    title: '提示',
    content: '请在手机端进行操作',
    showCancel: false
  });
} else {
  uni.chooseImage({
    count: 1,
    sizeType: ['original', 'compressed'],
    sourceType: ['album', 'camera'],
    success: function (res) {
      var tempFilePaths = res.tempFilePaths;
      // 这里可以处理选择的图片
    }
  });
}

5. 使用其他图片选择方式

如果 uni.chooseImage 在微信电脑版中无法正常工作,可以考虑使用其他图片选择方式,比如通过 <input type="file"> 来实现图片选择。

<input type="file" accept="image/*" @change="handleFileChange" />
methods: {
  handleFileChange(event) {
    const file = event.target.files[0];
    if (file) {
      const reader = new FileReader();
      reader.onload = (e) => {
        const imageData = e.target.result;
        // 这里可以处理选择的图片
      };
      reader.readAsDataURL(file);
    }
  }
}
回到顶部