收藏
回答

IOS12及以上版本调用拍照接口,重复拍照会出现刷新页面的bug

问题模块 框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
API和组件 小程序 Bug chooseImage 工具 6.7.4 2.0

- 当前 Bug 的表现(可附上截图)

async imageOrLocation (index, cameraOnly) {
let item = this.picture[index]
if (item.restrictiveConditionDto.requireGeographyInfo) {
this.getLocationRequired(index, cameraOnly)
} else {
this.chooseImage(index, cameraOnly)
}
},
chooseImage (index, cameraOnly) {
let vue = this
 // let sourceType = cameraOnly ? ['camera'] : ['album', 'camera']
 wechatlib.chooseImage({
count: 1,
   sizeType: ['compressed'],
   sourceType: ['camera'],
   success: async function (res) {
vue.$set(vue.picture[index], 'src', res.localIds[0])
vue.uploadImage(res.localIds[0], index)
},
   fail: function () {
vue.toast('选择图片失败')
}
})
},
getLocalImageDate (localID, index) {
let vue = this
 wechatlib.getLocalImgData({
localId: localID,
   success: function (res) {
vue.picture[index].src = res.localData
},
   fail: function () {
vue.toast('获取本地图片失败')
}
})
},
async getLocationRequired (index, cameraOnly) {
this.indicator('地理位置获取中')
let vue = this
 let indicator = true
 setTimeout(() => {
if (indicator) {
Indicator.close()
vue.messageBoxB()
}
}, 5000)
await wechatlib.getLocation({
type: 'wgs84',
   success: function (res) {
vue.picture[index].location = res.latitude.toString() + ',' + res.longitude.toString()
Indicator.close()
indicator = false
     vue.chooseImage(index, cameraOnly)
},
   fail: function (res) {
alert(JSON.stringify(res))
vue.messageBoxB()
Indicator.close()
indicator = false
   },
   cancel: function () {
vue.messageBoxA()
Indicator.close()
indicator = false
   }
})
},
async uploadImage (localId, index) {
let vue = this
 vue.indicator('上传中')
await wechatlib.uploadImage({
localId: localId,
   isShowProgressTips: 0,
   success: async function (res) {
vue.picture[index].value = await api.postImage(vue.$route.params.id, res.serverId)
let u = navigator.userAgent
     let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
if (isIOS) {
vue.getLocalImageDate(localId, index)
}
Indicator.close()
},
   fail: function () {
vue.toast('图片上传失败,请重试')
Indicator.close()
}
})
},

- 预期表现

点击拍照先获取地理位置,重复点击拍照,拍照完成,点击使用照片的时候,偶尔会出现页面刷新的情况。

- 复现路径


- 提供一个最简复现 Demo

<div v-for="(item, index) in picture" :key="item.id" class="img_container">
 <div class="pic">
   <div class="img" @click="imageOrLocation(index, item.restrictiveConditionDto.cameraOnly)">
     <img v-show="item.src" :src="item.src">
   </div>
   <p class="title">{{item.name}}</p>
 </div>
</div>

JS在上面。

最后一次编辑于  2018-12-07
回答关注问题邀请回答
收藏

1 个回答

  • 社区技术运营专员-娇华
    社区技术运营专员-娇华
    2018-12-07

    你好,请提供一下出现问题的机型和微信版本,以及能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html),ios系统版本是?

    2018-12-07
    赞同
    回复 5
    • triennium
      triennium
      2018-12-12

      出现问题的机型有: iphone6plus(系统版本12.0.1, 12.0),  iphone8(系统版本12.1),IOS系统11以及以下版本未出现此问题。

      能复现问题的简单代码片段:


      <div v-for="(item, index) in picture" :key="item.id" class="img_container">
        <div class="pic">
          <div class="img" @click="chooseImage (index, item.restrictiveConditionDto.cameraOnly)">
            <img v-show="item.src" :src="item.src">
          </div>
          <p class="title">{{item.name}}</p>
        </div>
      </div>
      chooseImage (index, cameraOnly) {
              let vue = this
              let sourceType = cameraOnly ? ['camera'] : ['album', 'camera']
              wechatlib.chooseImage({
                count: 1,
                sizeType: ['compressed'],
                sourceType: sourceType,
                success: async function (res) {
                  vue.$set(vue.picture[index], 'src', res.localIds[0])
                  vue.uploadImage(res.localIds[0], index)
                },
                fail: function () {
                  vue.toast('选择图片失败')
                }
              })
            },
      async uploadImage (localId, index) {
              let vue = this
              vue.indicator('上传中')
              await wechatlib.uploadImage({
                localId: localId,
                isShowProgressTips: 0,
                success: async function (res) {
                  vue.picture[index].value = await api.postImage(vue.$route.params.id, res.serverId)
                  let u = navigator.userAgent
                  let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
                  if (isIOS) {
                    vue.getLocalImageDate(localId, index)
                  }
                  Indicator.close()
                },
                fail: function () {
                  vue.toast('图片上传失败,请重试')
                  Indicator.close()
                }
              })
            },


      2018-12-12
      回复
    • triennium
      triennium
      2018-12-12回复社区技术运营专员-娇华

      对    微信版本是6.7.4    这个问题不是小程序中的    是移动端开发调微信的接口出现的问题。

      2018-12-12
      回复
    • 社区技术运营专员-娇华
      社区技术运营专员-娇华
      2018-12-12回复triennium

      查下是不是手机内存紧张导致的闪退问题吧

      2018-12-12
      回复
    • triennium
      triennium
      2018-12-12回复社区技术运营专员-娇华

      好的,谢谢。

      2018-12-12
      回复
    • 紫薯精灵
      紫薯精灵
      05-06

      解决了吗?我也遇到了同样的问题

      05-06
      回复