Vue渲染富文本图片点击预览

 1.渲染富文本:

使用Vue提供的 v-html 进行富文本内容渲染

<div v-html="content" @click="imageChgange($event)"></div>

2.获取点击元素,点击图片预览

绑定点击事件,传入 $event 参数

        //ImagePreview  Vant组件库图片预览组件

        imageChgange(e){
            if (e.target.nodeName == 'IMG') {
                ImagePreview({
                    images:[e.target.currentSrc],  //e.target.currentSrc  当前图片src
                    showIndex:false,
                    loop:false,
                })
            } else {
                return
            }
        }

 

©️2020 CSDN 皮肤主题: 技术黑板 设计师:CSDN官方博客 返回首页