elementui图片预览组件通过按钮控制展示

最新推荐文章于 2024-05-10 22:12:25 发布

一个巨蟹座的前端

最新推荐文章于 2024-05-10 22:12:25 发布

阅读量406

点赞数 11

文章标签： elementui 前端

本文链接：https://blog.csdn.net/weixin_47813845/article/details/135368229

版权

<ElImageViewer v-if="showImagePreview" :url-list="srcList" hide-on-click-modal teleported
                :on-close="closePreview" style="z-index: 3000" />
<script>
import ElImageViewer from "element-ui/packages/image/src/image-viewer";
export default {
    components: {
        ElImageViewer
    },
    data() {
        return {
            showImagePreview: false,
            srcList: [
                'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
            ]
        }
    },
    computed: {},
    creatd() {

    },
    mountd() {

    },
    methods: {
        showPreview(){
            this.showImagePreview = true
        },
        closePreview(){
            this.showImagePreview = false
        }
    }
}
</script>