复工的第二周,感觉大家的警惕性也放松了很多,基本上生活归于正常了。这周工作上解决了一个折磨了我一天的bug,还是有点收获的
想要留下的代码
1.jquery实现的中英文切换。
// 国际化文案
var MAPEN = {
账户登录: 'Login with Account',
用户名: 'Enter your account',
'用户名/手机号': 'Enter account or phone',
密码: 'Enter the password'
}
function getTranslation (key) {
var lang = getCookies('lang')
if (lang === 'en' ) {
return MAPEN[key]
} else {
// 这个地方很重要,若页面切换成了英文,得用下面的方法才能找到对应的中文
let findKey = (value, compare = (a, b) => a === b) => {
return Object.keys(MAPEN).find(k => compare(MAPEN[k], value))
}
return findKey(key) || key
}
}
// 中英文转换
function translation(){
$('.i18n').each(function (index, item) {
var i18n = $(item).text()
$(item).text(getTranslation(i18n))
})
$('input').each(function (i) {
if ($(this).hasClass('i18n')){
$(this).attr('placeholder', getTranslation($(this).attr('placeholder')))
}
})
}
}
})
遇到的坑
本周遇到了一个H5页面在IOS设备13.4.1系统白屏的问题,花了两天时间才解决问题,其中一天基本上处理环境问题记录一下。
- IOS H5页面的调试可以选择使用ios的safari浏览器,再将mac电脑用数据线与手机连接可参考这篇文章使用Safari调试iOS APP H5页面 在上面连接的过程中我遇到了两个问题,导致浪费了半天时间,第一个是手机与电脑用数据线连上之后,电脑回弹出要更新一个软件,应该是驱动之类的,但是我的电脑一直安装不上,更新不下来,也没找到解决办法,后来让同事帮忙看看,才发现不用安装也可以,这个问题就不了了之了,但是很奇怪我调试一会safari上显示的手机设备又不见了,就这样时而有时而没有,很无奈。后来发现只要手机跟mac连接的不是同一个网络那个设备就可以出来,后来换了网再连手机,那个设备就出现了,再切换手机的网络设备也还在,这样就可以调试了。
- 解决好连接手机的问题后,研究了一下发现页面根本没报错,但是js就是一直加载不出来,感觉就是还没有进项目然后时间一长页面就崩溃了,找不出是哪的问题,本来想在本地环境调试,由于mac不能开热点,我用了一个windows开启热点,mac连接windows的热点启用了Charles,手机也连接windows的热点配置Charles的代理,想实现本地联调,同时用一个安卓手机测试,发现安卓手机调试正常,苹果手机一直处于加载不出来的状态后来放弃了。改完代码部署预发,发现这样也是不行,也没法访问其他的网络,同时安卓的可以。找了半天发现把代理去掉就没问题网络正常,到这我才明白只要手机连接了热点,不用开代理就可以访问开热点那个电脑所配置的host,访问预发是没问题的,于是我又想,那是不是可以在windows上起项目,让手机直接访问本地的host,后来发现不行,太难了,后来一步一步排斥代码部署预发才终于解决了问题。问题在于项目里的一个国际化的cn.js的文件,由于翻译了省市区,那个文件4000多行,其中3000多行是省市区的中文map其实这是不需要的,于是我去掉它ios就可以正常访问了,至此终于解决了问题。