uniapp开发h5兼容问题（uniapp开发h5）
本篇文章给大家谈谈uniapp开发h5兼容问题，以及uniapp开发h5对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。
本文目录一览：
- 1、uniapp开发ios提示不再可用
- 2、uniapp之h5反向代理设置踩坑，解决跨域问题
- 3、如何解决h5、vue、uniapp等项目缓存问题
- 4、uni-app运行到H5正常，但运行到小程序不正常、报错总结
- 5、uniapp发布h5用户访问还是旧页面
- 6、uni-app在H5跨域问题小程序不需要跨域导致的兼容问题解决
uniapp开发ios提示不再可用
因为uniapp开发ios不兼容，所以不可用。
不得不说,任何一个开发者遇到苹果手机都会或多或少需要做适配。在使用uni-app开发小程序时,.由于页面大多数内容都是动态获取,当页面高度不给固定值时,让其随内容的填充自适应的时候,iPhoneXS Max手机在页面底部会出现白版,安卓手机不会有此现象. 解决办法:
//通过获取系统信息拿到屏幕宽高比,
const SCREEN_WIDTH = 750
const RATE = wx.getSystemInfoSync().screenHeight / wx.getSystemInfoSync().screenWidth
data(){undefined
ScreenTotalH: SCREEN_WIDTH * RATE, //拿到真实手机高度
}
//展示内容高度
//这样后苹果大屏手机内容底部不会白板
2.获取到时间字符串"2020-07-12 09:00:30" ,当我截取后取时和分为单位,如果时为"00"时,页面{undefined{dian}}点,显示为'0'而不是我要的'00',这个问题十分奇葩,虽然不是大的影响,加个三目判断:{undefined{dian=='00'?'00':dian}}点,就ok.
3.有时候小程序需要显示APP分享过来的H5页面,或者小程序本身需要显示H5页面时,需要配置https的域名,不然会无法正常显示。补充:(H5页面一般通过来展示,SRC里面的页面都是后台配置好的)
目前这是我遇到的苹果端适配问题以及解决办法。
uniapp之h5反向代理设置踩坑，解决跨域问题
uniapp可以适应多个平台开发，你会发现在HBuilderX上的内置浏览器上调接口，没问题；在小程序中，也没问题；连接手机联调也没问题；
当后台设置允许跨域之后，前端h5需要进行设置反向代理才能解决这个问题。
在manifest.json文件中，我们需要输入我们的端口号
然后去视图源码下查看多了h5这个配置
我们需要在自动生成的h5配置中进行编写代理设置
这里需要注意的是"target" : " ", 这里是写http还是https，需要与后台保持一致，不然会报500.
然后我们去使用我们的代理，进行带接口
如何解决h5、vue、uniapp等项目缓存问题
我们再开发web项目时，经常会遇到修改了css、js、html等静态文件，并部署到服务器之后。使用浏览器进行访问的时候，发现并没有什么变化，这就是静态缓存。我们应该如何处理静态缓存呢？首先我们先了解什么是静态缓存。
html文件添加Expires时间
CDN是静态缓存加速最典型的代表。CDN技术并不是一门新的技术，它是基于传统 nginx、squid、varnish 等 web 缓存技术，结合 DNS 智能解析的静态缓存加速技术。
方式二：
uniapp解决缓存的方式与vue一样，但是uniapp兼容了很多平台，所以修改vue.config.js又不太一样。如果uniapp根目录下面没有vue.config.js，则新建vue.config.js文件即可。
uni-app运行到H5正常，但运行到小程序不正常、报错总结
同级多个 v-for 时 key 的值是不允许重复的，key 的绑定是不支持表达式的，需要按照以下方式处理。
控制台"Cannot read property 'globalData' of undefined"
解决办法：将getApp()替换成this
以上错误的写法编译都会不通过
问题应该出在(item.title || '').length，其中(item.title || '')得到的结果有问题
解决办法：加入in(this)
原因：h5引用组件会渲染成uni-view标签，而小程序直接是comp-a标签，此时虽然显示设置了样式，但不会渲染出来
解决办法：在子组件中设置好样式，或者用/deep/ 对子组件下的节点设置样式
解决办法：在父组件修改对象的数据，不要在子组件操作，网上说是微信小程序无法直接操作props里的对象
1.竖向的列表，使用的view的滚动，并设置overflow-y:scroll;滑动列表然后点击列表某一项跳转详情后，再回到列表页，view总是回到了顶部，和 这个问题 一样。
解决办法：
使用scroll-view替换view，设置scroll-y=true，但也产生了一个问题，scroll-view的宽度默认继承父级元素的宽度（屏幕宽度），并不是等于所有子集元素的和，因此需要动态设置scroll-view的宽度
2.uni设置scroll-top为0无效
uniapp里面使用scroll-view 组件，动态设置scroll-top 属性来控制滚动高度，但是当想滚动到起始位置时 设置动态值为0 时无效的
解决办法：
首先要定义一个变量记录滚动条的位置
用 @scroll="scrollChange" 监听 滚动条变化
定义一个变量 存滚动的位置，当需要滚动到 初始值的时候
先将滚动的当前高度赋值给scrollTop 然后设置为0 就有效果了
uniapp发布h5用户访问还是旧页面
uniapp优点:
①兼容性好
Uni-app最大的特点就是一套代码编译以后多端通用，开发人员不需要在每个平台都单独开发一套代码，节省了大量的成本。
②学习成本低
由于uni-app基于vue.js开发，因此对于前端开发工程师不会十分困难，学习uni-app的门槛也相应降低。
③开发速度快
由于uni-app是用HBX进行开发，所以支持vue的语法。
④拓展性强
Uni-app支持nvue，封装了H5+。同时，还支持原生的iOS和安卓开发。
⑤开发团队支持多
目前uni-app的开发团队DCloud发布新版本的频率比较频繁。
uni-app在H5跨域问题小程序不需要跨域导致的兼容问题解决
应用场景：很多时候我们开发uni-app的时候，在H5端总是会遇到跨域问题，但是小程序这些不需要跨域，导致出现的不兼容问题 ，本篇文章完美解决了这些问题
uniapp开发h5兼容问题的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于uniapp开发h5、uniapp开发h5兼容问题的信息别忘了在本站进行查找喔。
