admin管理员组文章数量:1571140
前段时间用vue2.0做了个单页面应用,嵌在钉钉浏览器里。
前期开发的时候一直用goole浏览器调成手机模式开发,等开发基本完成后再打包放在钉钉浏览器上测试。
测试发现,项目一部分内容没有显示出来,百度后引入了babel-polyfill,将es6转成es5,结果项目全部可以显示了。
测试细节的功能发现:
1、vue子组件mounted执行的axios请求后赋值给data里面的某个变量,视图偶发性的不随着更新
2、调用一个方法改变data里的某个变量,发现视图会加载两层,也就是初始值的视图一层,改变后的值的视图又加载一层
3、还有一些图片偶发性出不来的问题
在小米、魅族上的钉钉浏览器都出现这些问题,iPhone和oppo正常,总之出现的这些异常都违背了vue的渲染机制。
为了解决问题,换了好多的实现方式,发现都未果,以为是这几个安卓的手机钉钉浏览器不能很好的支持vue。
然后换了一个其他的vue项目,居然发现能够打开,而且数据渲染都正确。那说明不是不支持vue,而是当前项目的代码有问题。
我就把多余的代码的注释掉,写了很简单的数据改变并改变视图的demo,发现可行,然后一步一步放开注释的代码,最后定位到一句css上,某个html元素设置的height过大,导致左边的html出现滚动条,从而影响了右边的数据渲染。至于怎么影响我想不明白啊。。。。。。
最终问题解决了,经验教训:
1、开发前期一定要配置好环境测试,不然等项目开发后期定位问题会困难很多
2、原来css这么强大,居然可以影响到数据渲染
版权声明:本文标题:vue2.0在安卓手机浏览器(主要是钉钉浏览器)的兼容性处理 内容由热心网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:https://www.elefans.com/dianzi/1727159185a1099749.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论