<template>
    <span>
		<el-button v-if="!src" type="text" disabled >暂无图片</el-button>
        <el-button v-else type="text"  @click="preview(src)">{{title}}</el-button>
        <el-dialog  :visible.sync="imgsVisible" center>
            <div style="display: flex;justify-content: center;">
                <img alt="" :src="src" fit="scale-down" lazy style="padding:0;max-width:500px" :onerror="errorImg" />
            </div>
        </el-dialog>

    </span>
</template>

<script>
    export default {
        name: "preview",
        data(){
            return{
                imgsVisible:false,
                errorImg:'this.src="' + require('@/assets/null.jpg') + '"'
            }
        },
        props:{
           src:{
               type:String,
               default: ''
           },
           title:{
               type:String,
               default: '查看图片'
           }
        },
        methods: {
            preview( imgUrl ){
                this.imgs = imgUrl;
                this.imgsVisible=true;
            }
        }
    }
</script>
