ios和安卓嵌套h5 ios上传文件无法选择文件的问题

这几天在做app嵌套h5的时候,遇到一个问题,写上传文件的时候遇到一个问题,安卓上传文件可以正常使用,但是ios拉起文件管理的时候,里面的文件不能选择。

因为一开始我是自己写的上传,没有使用组件什么的,所以有时候这些文件可以选择,有些时候就如图这样,选择不了,所以感觉是input type="file" 标签里面的配置有问题,所以一个一个的排查。

后面发现是 accept限制类型的时候,ios那边识别不了,accept我是设置的所有文件 */*,但是安卓可以识别,但是ios识别不了,最后改成进入页面先判断下设备 是安卓还是ios 然后再去配置accept

input标签

<input type="file" ref="file" @change="fileChange($event)" :accept="phone == true?*/*:"  style="display:none">

判断设备

isPhone(){
        let ua = navigator.userAgent.toLowerCase()
        if(ua.indexOf("android") != -1){
          this.phone = true                 //true是安卓 false是ios
        }else if(ua.indexOf("iphone") != -1){
          this.phone = false
        }
}

这样写ios变成了如下:

这样就可以上传ios的文件了

经验分享 程序员 微信小程序 职场和发展