项目中遇到的问题

1.toast弹窗  安卓可以，ios点击无反应

 

ios  不识别onclick—改为ontouchend

 

2.ios浏览器  不识别svg

 

方法将href改为xlinkHref

 

3.ontouchend太过灵敏  会将滑动当作点击事件  

　　

改为onclick  加样式cursor：pointer

  

4.诡异的header问题：header里的key一定不能用下划线，可能会被服务器、nginx等拦截过滤掉，导致服务端取不到header

 

解决：下划线改为中划线

 

5.fetch  发送请求不会带cookie信息，安卓、ios8p上均稳定复现

 

解决方法：加一个参数：credentials: 'same-origin’或者改用axios方式

 

6.使用第三方库loadsh.debounce  debounce，input遇到事件丢失

 

背景：在一个 input 输入框中，给其绑定了一个 onChange 事件，每次输入后，都会触发一个回调函数。因为我们想要的只是用户输入的最后结果，所以除了用户输入完成后触发的回调函数，其他都是冗余的。因此，需要对绑定的回调函数做 debounce 处理

 

解决方案：

http://billqiu.github.io/2017/10/15/how-to-debounce-in-react/

 

debounce.js  源码：

https://www.cnblogs.com/wandiao/p/7223269.html

 

过程：但是在回调事件里得到不输入的值，即事件丢失了，查找文档发现是react合成事件的原因，react有个事件池，合成事件对象会被重用，并且所有的属性会在事件回调被调用后背nullifies

 

经过debounce包装后的回调函数，变成了一个事件，池化后被nullified了

 

7.react分页，pageSize问题

 

多看官方文档，如果有pageSize的约定，就在分页组件里加入pageSize

 

8.导出列表是乱码问题

 

排查：rd使用了GBK编码方式，改为UTF-8方式，也没生效，最后两方同时设为不使用编码方式。get请求可以，post不可以，需使用这样的请求方式：

axios({

      url: api.download,

      responseType: "blob",

      params: params,

      method:"POST",

      headers: {

        "Content-Type": "application/json"

      }

    })

 

奇葩的问题：

9：莫名其妙折行，css没有任何宽度设置，最终查找到是￥前面有一个空格引起的，即 ￥ ，至今也不知道为什么？

10：也是查找了1个多小时，谷歌浏览器不设置成手机模式，可以正常显示并浏览页面，设置成手机模式，就白屏，不显示，重启电脑、浏览器升级均不好用，最终查找到是因为手机模式，把ua设置成了app，昨天切换的，忘记切回了，切回正常模式就好了，坑。

 

转载于:https://www.cnblogs.com/kingsly-xue/p/10523492.html