汽车H5使用ReactJs问题汇总

Q:安卓4.4webview显示空白?

A:初步怀疑是css属性没有加前缀引发的兼容问题,但添加后发现也不行,通过webview调试后控制台输出Set is undefined,搜索后发现React依赖集合类型 Map 和 Set。所以如果要兼容低版本浏览器可以引入一个全局的 polyfill,例如 core-js 或 babel-polyfill。

Q:安卓低版本点击事件不生效?

A:调试检查发现该点击事件中使用了for of语法,无法兼容低版本,使用map或forEach方法替换即可。

Q:使用@import导入的css文件没有被autoprefixer自动添加前缀?

A:检查发现部分flex和transfrom属性没有加兼容前缀,但项目引入了autoprefixer自动添加前缀的插件,经过对比代码发现在scss文件中使用@import引入的文件都没有被成功添加,通过引入postcss-import可以解决这个问题。

Q:android上line-height不居中的问题?

据分析得知原因:

1.字体大小不要使用奇数字号,带小数点的更不要提了。也就是说被2整除的整数且不可小于12px。

2.使用rem的单位时造成(根元素如果动态改变时,根元素字体可能不是整数)。

由于网上的方法都不好使,后来想了个办法,把用到line-height设置垂直居中的标签都换成button。。。就行了!

Q:移动端使用overflow-auto实现滚动卡顿?

A:添加属性 -webkit-overflow-scrolling: touch;  //有回弹效果

Q:Android WebView 调试方法

前置条件Android4.4+

1.在APP中启用 WebView 调试,开启调试后,Chrome DevTools才能对WebView进行远程调试;

WebView.setWebContentsDebuggingEnabled(true); 

2.通过访问chrome://inspect/#devices访问已启用调试的 WebView 列表;点击inspect即可调试,如无法调试页面空白FQ即可。

ReactJs移动端兼容问题汇总的更多相关文章

  1. 【移动端兼容问题研究】javascript事件机制详解(涉及移动兼容)

    前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...

  2. C/S端开发问题汇总

    0.先推荐几款工具,连接远程客户端DameWare Mini Remote Control,搜索本地文件Everything,以及sysinternals的系列工具: FileMon-监视所有文件修改 ...

  3. 网页背景H5视频自动播放---PC端、移动端兼容问题完美解决方案(IOS、安卓、微信端)

    最近公司官网需要使用视频当做banner背景且自动播放,并且因为是官网需要做到PC端和移动端都可以适配兼容,这些问题很是头疼: 兵来将挡,水来土掩,进过查阅相关技术资料,现已完美兼容PC端和移动端.下 ...

  4. vue e.path 移动端兼容

    作用 e.path 用来获取点击元素及以上所有父元素的一个数组 问题 当在移动端会有获取不到e.path的问题 不兼容 解决 let path = event.path || (event.compo ...

  5. 移动端—— 兼容PC端,移动端的点击事件

    移动设备上不支持鼠标事件,好在webkit内核的移动浏览器支持 touch 事件,所以触摸事件是移动应用中所必须的.touchstart.touchmove.touchend事件可以类比于moused ...

  6. 年度账单h5 移动端兼容问题以及优化建议(vue)

    定时器 vue实例中定义timer多余,创建的定时器代码和销毁定时器的代码没有放在一起,通常很容易忘记去清理这个定时器,不容易维护:建议使用this.$once('hook:beforeDestory ...

  7. Nodejs reactjs服务端渲染优化SEO

    一.准备动作 1.安装nodejs与安装express 安装nodejs教程:http://www.cnblogs.com/pigtail/archive/2013/01/08/2850486.htm ...

  8. ie6兼容问题汇总

    这几天在查找和解决网页在ie6下的兼容性问题花了我不少的时间,参考了网上的一些解决方法和自己做出来比较有效果的给大家参考一下,也方便我日后再用到: 1.IE的cache设置为Every visit t ...

  9. ie浏览器兼容问题汇总

    对兼容ie浏览器所遇到的问题及总结 互联快谈 2016-10-28 05:51 1,若直接给一个元素设置absolute定位.在浏览器缩放的时候.位置会错位.解决的方法是给外层的元素设置为relati ...

随机推荐

  1. coTurn 使用测试方法

    做个记录 1.从"../examples/etc/" 目录拷贝turnserver.conf文件到"/usr/local/etc/"目录 2.修改配置文件 主要 ...

  2. Linux atop 监控系统状态

    atop是一个功能非常强大的linux服务器监控工具,它的数据采集主要包括:CPU.内存.磁盘.网络.进程等,并且内容非常的详细,特别是当那一部分存在压力它会以特殊的颜色进行展示,如果颜色是红色那么说 ...

  3. [Hive_add_8] Hive 常用参数配置

    0. 说明 记录 Hive 常用参数的配置 1. 设置本地模式 让 Hive 自动使用 Hadoop 的本地模式运行作业,提升处理性能 适合小文件,一般用于测试 set hive.exec.mode. ...

  4. AppiumLibrary常用关键字

    通过上一章节,open application关键字的使用,相信大家对手机自动化充满了兴趣,那么今天这一章节,主要介绍AppiumLibrary中常用关键字的使用. 一.实用函数 关键字 含义 实例 ...

  5. 4.3Python数据处理篇之Matplotlib系列(三)---plt.plot()折线图

    目录 前言 (一)plt.plot()函数的本质 ==1.说明== ==2.源代码== ==3.展示效果== (二)plt.plot()函数缺省x时 ==1.说明== ==2.源代码== ==3.展示 ...

  6. 【转载】ubuntu下/usr/bin和/usr/local/bin的区别

    这篇文章已经无法考证是谁原创的了 首先注意usr 指 Unix System Resource,而不是User 然后通常: /usr/bin下面的都是系统预装的可执行程序,会随着系统升级而改变. /u ...

  7. LeetCode算法题-Pascal's Triangle(Java实现)

    这是悦乐书的第170次更新,第172篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第29题(顺位题号是118).给定非负整数numRows,生成Pascal三角形的第一个 ...

  8. 【C编程基础】make命令和makefile文件

    1.关于程序的编译和链接 一般来说,无论是C.C++首先要把源文件编译成中间目标文件即 Object File(windows为.obj文件,unix为.o文件),这个动作叫做编译(compile). ...

  9. C#、Java中的一些小知识点总结(持续更新......)

    前言:在项目中,有时候一些小的知识,总是容易让人忽略,但是这些功能加在项目中往往十分的有用,因此笔者在这里总结项目中遇到的一些实用的小知识点,以备用,并持续更新...... 1.禁用DataGridV ...

  10. Linux之文件属性

    文件属性是什么? [root@luffy_boy-001 /]# ls -lhi /etc/hosts 129822 -rw-r--r--. 2 root root 198 Jan 11 2019 / ...