项目中遇到的问题

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 处理
 
解决方案:
 
debounce.js  源码:
 
过程:但是在回调事件里得到不输入的值,即事件丢失了,查找文档发现是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,昨天切换的,忘记切回了,切回正常模式就好了,坑。
 
posted @ 2019-03-13 15:32  kingslyxuer  阅读(217)  评论(0编辑  收藏  举报