遇到这些问题如何解决

158 阅读2分钟

移动端IOS滚动条滑动卡顿

<!-- CSS -->

-webkit-overflow-scroll:Touch;

ios键盘弹出影响position:fixed定位

监听input的oninput和onblur来修改布局或者resize事件判断屏幕高度变化

动画卡顿

<!-- CSS -->
<!-- 开启硬件加速 -->

transfrom:translate3d

移动端IOS12键盘收起,页面卡住不回落

<!-- JS -->
<!-- 在输入框blur时 -->

window.scrollTo(0,scroll)

移动端IphoneX的适配问题

使用媒体查询判断屏幕尺寸,底部留出44px的非响应区域

实现一个虚拟键盘

自己画一个键盘,用其他元素伪造一个input框 , 展示输入动画交互的假象即可

canvas画布污染问题

转成base64再进行绘制

多倍屏1px问题

使用媒体查询 + 缩放解决

微信小程序 请求不能携带cookie

把cookie设置到header

React 路由配置分散难以管理

手动封装,实现类似vue的支持配置的路由 , 使用递归生成所需的DOM即可

websocket请求标识

当服务端发消息回来,要知道是响应哪个请求的,在每次发送请求的时候生成一个id , 携带判断

微信小程序web-view监听的h5的postmessage不能实时的问题

采用wx.miniProgram.navigateBack或wx.miniProgram.redirectTo触发

微信小程序 保存用户昵称需要注意的问题

拿到的用户昵称需要使用utf16to8编码入库,取出再utf8to16使用;否则emo表情会乱码;

微信小程序 button组件样式问题

某些情况可以rgba:0000设置为透明色,解决一些展示问题

IOS端时间兼容问题

建议使用2020/10/10
new Date('2020-10-10') 在IOS端会有问题 

Vue项目的SEO优化问题

1. 使用ssr服务端渲染

2. 使用库 prerender-spa-plugin 结合 vue-meta-info 配置webpack打包实现输出多html

Git解决常规冲突

<!-- (1) -->
    1.  git add .
    2.  git commit -m '提交代码'
    3.  git pull (此时发现冲突)
    4.  (删掉冲突代码后):git add .
    5.  git commit -m '解决冲突'
    6.  git rebase --skip
    7.  (跳出冲突分支后): git push

<!-- (2) -->
    1.  git add .
    2.  git commit -m '提交代码'
    3.  git pull (此时发现冲突)
    4.  (删掉冲突代码后):git add .
    5.  git rebase --continue
    6.  (跳出冲突分支后): git commit -m '解决冲突'
    7.  git push