hookehuyr

fix(图片预览): 修改图片点击事件仅预览单张图片并禁用索引循环

将图片预览功能从显示所有图片改为仅预览当前点击的单张图片,并禁用索引显示和循环功能,提升用户体验
...@@ -123,7 +123,11 @@ const distributeImages = (images) => { ...@@ -123,7 +123,11 @@ const distributeImages = (images) => {
123 }) 123 })
124 } 124 }
125 125
126 -// 图片点击事件 - 使用ImagePreview 126 +/**
127 + * 显示图片预览(仅单张)
128 + * @param {Object} item - 当前点击的图片对象
129 + */
130 +// 图片点击事件 - 仅预览当前单张图片
127 const onImageClick = (item) => { 131 const onImageClick = (item) => {
128 console.log('点击图片:', item) 132 console.log('点击图片:', item)
129 133
...@@ -133,10 +137,12 @@ const onImageClick = (item) => { ...@@ -133,10 +137,12 @@ const onImageClick = (item) => {
133 // 提取所有图片的src用于预览 137 // 提取所有图片的src用于预览
134 const images = allImages.value.map(img => img.src) 138 const images = allImages.value.map(img => img.src)
135 139
136 - // 显示图片预览 140 + // 仅预览当前单张图片,禁用索引与循环
137 showImagePreview({ 141 showImagePreview({
138 - images, 142 + images: [images[currentIndex]],
139 - startPosition: currentIndex, 143 + startPosition: 0,
144 + showIndex: false,
145 + loop: false,
140 closeable: true 146 closeable: true
141 }) 147 })
142 } 148 }
......
...@@ -123,7 +123,11 @@ const distributeImages = (images) => { ...@@ -123,7 +123,11 @@ const distributeImages = (images) => {
123 }) 123 })
124 } 124 }
125 125
126 -// 图片点击事件 - 使用ImagePreview 126 +/**
127 + * 显示图片预览(仅单张)
128 + * @param {Object} item - 当前点击的图片对象
129 + */
130 +// 图片点击事件 - 仅预览当前单张图片
127 const onImageClick = (item) => { 131 const onImageClick = (item) => {
128 console.log('点击图片:', item) 132 console.log('点击图片:', item)
129 133
...@@ -133,10 +137,12 @@ const onImageClick = (item) => { ...@@ -133,10 +137,12 @@ const onImageClick = (item) => {
133 // 提取所有图片的src用于预览 137 // 提取所有图片的src用于预览
134 const images = allImages.value.map(img => img.src) 138 const images = allImages.value.map(img => img.src)
135 139
136 - // 显示图片预览 140 + // 仅预览当前单张图片,禁用索引与循环
137 showImagePreview({ 141 showImagePreview({
138 - images, 142 + images: [images[currentIndex]],
139 - startPosition: currentIndex, 143 + startPosition: 0,
144 + showIndex: false,
145 + loop: false,
140 closeable: true 146 closeable: true
141 }) 147 })
142 } 148 }
......