当我们渲染富文本的时候，免不了会插有图片，如果想给图片一个预览功能就可以点击事件配合element预览组件来实现！

 <div v-for="(item, index) in contform.descList" :key="index">
              <span class="desc_title"
                >{{ toChinesNum(index + 1) + "、" }}{{ item.dictLabel }}</span
              >
              <div class="ql-editor" v-html="item.desc" @click="imageChagange($event)"></div>
            </div>

引入element图片预览组件 并注册 //element组件自带图片预览组件由于ie兼容问题则没有展示该组件

components: {
    ElImageViewer: () => import("element-ui/packages/image/src/image-viewer"),
  },

方法

//富文本渲染文本点击
    imageChagange(e){ 
      if (e.target.nodeName === 'IMG'|| e.target.nodeName == 'img') { //判断是否图片标签
        const img = e.target.currentSrc //获取点击图片地址
        this.onPreview([img]) 
      }
    },
  //开启富文本图片预览
    onPreview(img) {
      this.srcListView = img
      this.showViewer = true;
    },
  //关闭富文本渲染文本图片预览
    closeViewer() {
      this.showViewer = false;
    },

 这样就可以实现v-html渲染给图片添加大图预览功能了！！！！