想要不使用 el-image
组件,即为不想展示小图,想要点击按钮的时候预览图片。
本文 Element-ui 版本 2.11.1
及以上
使用el-image-viewer
引用组件:
components:{
'el-image-viewer': () => import('element-ui/packages/image/src/image-viewer')
},
template中使用:
由于我是在弹窗内使用该组件出现被弹窗盖在下面的情况,查看控制台 el-dialog
的z-index
为2003,则给图片更高层级,避免被盖住。
<el-image-viewer style="z-index: 2222;" v-if="imgViewerVisible" :on-close="()=>{imgViewerVisible=false}" :url-list="imgList" />