写了好久的一个接近原生体验的 React 图片查看器组件

[wyn153409018]

Feature

• 双击放大指定位置（手势库使用 alloyfinger ）
• 为移动端而生，pc 端也可以正常使用）
• 性能良好，我用骁龙 810 60fps 没问题。此外理论上支持展示无数张图片，不像大多数轮播图会把所有图片都渲染出来，这个组件同时最多渲染三张（前一张，当前图片，后一张）
• 兼容性还不错，移动端应该没啥问题，其实我已经拿去在二线互联网公司的一个小产品上线了,不过要求 react16 以上.
• 有测试（但 coverage 只有可怜的 17%，不知道算 feature 还是 bug ==）

Todos

• 多指放大，最早其实实现了，即 github 上的那张 gif，但是不能从指定位置放大所以改成双击了。
• 组件进入推出动画
• 重构！因为涉及到同时触摸控制父子元素，edge case 太多了。。。所以代码写的有些乱

demo

Github

一点点不成熟的总结

[wyn153409018]

补充下，这个组件最麻烦的地方是处理触摸事件，当图片超出屏幕时应该触摸拖拽图片，在屏幕范围内则触摸拖拽整个列表，导致这个组件有些庞大（ 24kb ungzipped)
17 届的应届生，第一次发帖，也希望各位能够多多指点。

[wyn153409018]


[huiyifyj]

不错的。mark 一下。

[gaobh]

mark

[azh7138m]

Android7 chrome63，不能放大

[wyn153409018]

@azh7138m 我也是安卓 7 chrome 哎，我这里没有问题很奇怪，有啥错误信息么，毕竟上线的东西，有 bug 我就 gg 了

[wyn153409018]

@azh7138m 我猜你是不是点的是 loading 动画～

[azh7138m]

@wyn153409018 你等下，我开个调试看看

[azh7138m]

@azh7138m 不知道啥问题，电脑上没问题，手机上不行，更新到 64 也不行，我觉得是版本的问题，ff57 是可以的

[wyn153409018]

@azh7138m 谢谢，我看一下

[sinchang]

赞 代码很工整 看的很舒服

[wyn153409018]

@sinchang 啊哈，谢谢表扬