-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Closed
Labels
Description
打开官方示例网站https://fengyuanchen.github.io/viewerjs/
把第一个img 通过谷歌F12 删除所有的标识
然后点击第二张图片显示
结果显示第三张图片
点击缩略图第二张 结果显示 第三张图片
看源码分析如下
https://github.com/fengyuanchen/viewerjs/blob/master/src/js/render.js
在渲染缩略图时
会遍历element元素中img生成,同时赋予缩略图下标,但是做了一个无图片路径过滤操作
导致下标错乱
https://github.com/fengyuanchen/viewerjs/blob/master/src/js/methods.js
而在显示图片时传入的下标又直接去取items里的而不是去判定那个是导致该错误出现
临时解决方案是
// 给item也增加下标
+++ item.setAttribute('data-index', index);
// 修改获取方式
--- const item = this.items[index];
+++ const item = this.items.find(item => Number(getData(item, 'index')) === index);
所有地方this.items[下标]
都需要改成这种
期待作者有更好的方法