vue3+ele-plus的页面,采用el-image组件实现图片展示及点击大图预览功能,大图预览在PAD端访问时无法使用?求解?

使用vue3+ele-plus的页面,采用el-image组件实现图片展示及点击大图预览功能,该页面要兼容PAD移动端访问使用,其中el-image组件配置的点击大图预览功能在PAD端使用时放大缩小、图片旋转等功能好像无法正常使用,求教兼容解决方法。


使用el-image组件显示图片,并可点击大图预览,代码及截图如下:

              <!-- 病历图片展示 -->
              <el-image class="previewImg" :src="previewImageUrl" :zoom-rate="1.2" :preview-src-list="previewSrcList"
                :initial-index="1" fit="contain">
                <template #error>
                  <div class="image-slot">
                    <el-icon>
                      <Picture />
                    </el-icon>
                  </div>
                </template>
              </el-image>

image.png
PC端访问,点击大图预览功能使用正常,如下图:
image.png


求教兼容实现PAD端访问网页可正常点击图片实现大图预览,并可拖拽局部方法缩小、旋转等功能的解决办法。或者有无其他兼容PC端、PAD端访问图片展示及点击大图预览的好的插件推荐。

阅读 1.5k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题