devicePixelRatio 引发的血案

时间:2021-2-20 作者:admin

又是阳光明媚的一天.开心的把代码码得飞起. 但生活就是这样,你永远不知道下班和bug哪个会先来.

这不,刚哼着小调,那边测试就告诉甩过来一个 bug , 测试发现滚动加载无效,当时我就….

咳咳,错了,像我这么英俊潇洒,玉树临风,才高八斗,学富五车的人怎么可能写bug嘛 .

当场按照测试提供的操作步骤一顿操作… 没有问题呀,瞬间迷惑,开始进行检查,查看测试是否和我在相同的环境,相同的版本等,一顿检查下来,发现没有问题…

叫来测试,让他给我当场演示,发现问题确确实实是存在的.

当时就感觉懵了,这晚上还回得去吗?…

这个组件库是使用了很长时间的组件库,而且本质上只有一行代码调用无限滚动指令…没有任何报错,瞬间令人头大,这时候测试表示当缩放的时候也可能存在对应的情况

一顿操作,浏览器缩放大小,发现确实存在相应的情况,一提到缩放屏幕,能想到的是什么? devicePixelRatio,屏幕像素比,而且发现只有在 devicePixelRatio 为某些固定值的时候才会出现问题,瞬间 get 到问题点, 这不就是典型的 devicePixelRatio 值和浮点数精度丢失的问题嘛,那么在触发的时候只需要添加一个区间即可,说干就干,一顿操作猛如虎, 然后测试反馈问题已解决.

但我可不能就这样轻松放过这个问题.

没错,由于使用的库,其实从 element-ui 一脉相承(程序猿的事儿,能叫做抄袭么,这叫借鉴),那么去 element-ui 去看看,顺带搞搞事情

哈哈,发现 element-ui 的 无限滚动示例 也存在对应的问题,就是在浏览器 devicePixelRatio 为 1.75 的时候会出现对应的问题,无法触发滚动加载,甩手就是一个 issue, 其实修改一下触发的默认值,或者在最后计算的时候考虑浮点数的问题就可以解决,这说不定就是一个加入开源项目的好的开始,但想想那些存在的bug,还是周末再去解决吧

现在 element-ui 的示例还是存在类似的问题,诸位在使用的时候注意啦,最简单的办法就是设置触发值为一个小值,可以忽略掉浮点数的问题,自然感兴趣的还可以去 element 修复一下这个问题,提个 pr ,哈哈就说不定就能为开源社区贡献一份力了

声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。