就是想通过点击这个按钮,显示大图预览,Image默认是要需要缩略图的,这个地方是不用缩略图的,记录下解决方法
import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
...
components: { ElImageViewer },
data(){
return {
srcList: [
'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg'
],
isShowPics: false
}
},
methods:{
handlePreview() {
this.isShowPics = true
},
onPreview() {
this.isShowPics = true
},
// 关闭查看器
closeViewer() {
this.isShowPics = false
},
}
...
<el-image-viewer
v-if="isShowPics"
:on-close="closeViewer"
:url-list="srcList"
/>
这样就轻松实现了预览大图的效果