自定义了prev跟next事件，我需要切换下一张照片异步添加水印，页面上的图片有水印，v-viewer预览图片的缩略图更新了，但是中间大图没有更新，并且导致按play按钮黑屏

[wdnmd123-zzz]

<div class="imgView" v-viewer="options"> <img :src="selectFileSrc" @dragstart.prevent crossorigin="anonymous" /> </div> options: { inline: false, viewed(e) { // this.index = e.detail.index; }, title: [ 4, (image, imageData) => (${imageData.naturalWidth} × ${imageData.naturalHeight})`, ], toolbar: { zoomIn: 4, zoomOut: 4, oneToOne: 4, prev: () => { console.log("prev");

        this.preImg();
      },
      play: true,
      next: () => {
        console.log("next");
        this.nextImg();
      },
      rotateLeft: 4,
      rotateRight: 4,
      flipHorizontal: 4,
      flipVertical: 4,
    },
    rotatable: true,
    scalable: true,
  },`

![Uploading image.png…]()

[wdnmd123-zzz]

[mirari]

这类操作恐怕只能先定位到viewer窗口内的大图元素再用脚本修改了 viewer弹出时获取到的图片URL都已经固定了

[wdnmd123-zzz]

这类操作恐怕只能先定位到viewer窗口内的大图元素再用脚本修改了 viewer弹出时获取到的图片URL都已经固定了 有什么示例吗

[mirari]

添加水印的方式是什么，后端返回一个新的URL还是前端覆盖一个水印元素？ 反正都是在view事件回调中用querySelector('.viewer-canvas')获取到HTMLElement再自行处理

[wdnmd123-zzz]

添加水印的方式是什么，后端返回一个新的URL还是前端覆盖一个水印元素？ 反正都是在view事件回调中用querySelector('.viewer-canvas')获取到HTMLElement再自行处理

前端修改的，点击下一张图片异步给图片添加水印，替换成base64格式的图片

[mirari]

获取到.viewer-canvas下面的img元素再把url替换成base64字符串

[wdnmd123-zzz]

.viewer-canvas 按照你的方法已经可以了，但是点击play之后还是黑屏应该怎么解决

[mirari]

应该是直接修改影响了viewerjs内部的状态

另一个思路是修改images数组里的值，v-viewer会自动调用viewer的update方法更新数据。 或者主动调用viewer的update方法