vue点击图片放大预览图片、旋转等
//引入图片预览插件(前提是安装了element ui)
import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
components: {
ElImageViewer,
},
data() {
return {
designUrl: '',
showViewer: false,
}
}
methods:{
// 关闭查看器
closeViewer() {
this.showViewer = false
},
//点击查看图片
handleDesignInfo(rows) {
this.showViewer = true
// rows.src:图片地址
this.designUrl = rows.src
},
}
使用
<el-image-viewer v-if="showViewer" :on-close="closeViewer" :url-list="[designUrl]" />