工作笔记-关于安卓和ios兼容
一、移动端开发，客户端的键盘bug
现象：当用户点击卡面的按钮，弹出密码验证框和客户端键盘，此时点击验证框的按钮，ios的弹窗和键盘消失，然而并无其他事发生。
bug定位：安卓功能完好，ios出现，所以采用打印的法式看js逻辑走向，发现前端的点击事件逻辑并未触发。猜想，也就是说看似点了确定按钮，却没点上去，但是又触发了隐藏键盘和键盘的事件。想到vant组件的vantActionSheet组件有点击弹窗外遮罩层会隐藏弹窗的事件，便在此事件上做了打印，发现正是此时触发了。所以定位bug在ios客户端的密码键盘自带一层遮罩层，或者点击非键盘区域会隐藏键盘触发相同的点击遮罩层事件。
解决：开始想让客户端做这个键盘不要有点击非键盘区域触发任何方法。但考虑其他场景有可能需要此功能。前端最后尝试采用延时的方法，键盘隐藏效果触发时（键盘隐藏触发前端js，前端动态去掉下边距，让验证框触底），弹窗50毫秒延时仍旧停留此处，此刻的点击事件就做用到了点击按钮身上。
二、移动端开发，设置卡片阴影，ios不生效
现象：设置卡片阴影，前端用了box-shadow:0 8px 16px 0 rgba(56,58,63,0.04)安卓显示阴影，ios不显示阴影。
bug定位：绝对的是兼容问题。
解决：在百度搜索，进行尝试，发现增加以下代码可行。-webkit-appearance:none;-webkit-box-shadow:0 8px 16px 0 rgba(56,58,63,0.04)
|