KM-Front-Milestone2/src/views/modules/knowledge/components/previewVisible.vue

<template>
  <div>
    <a-modal :closable="false" class="previewImg" width="50%" :visible="previewVisible" :footer="null" @cancel="handleCancel">
      <img alt="example" style="width: 100%;margin-top: -1vw;" :src="'/api/api-system/system/core/sysFile/previewFile?fileId='+imgStr"/>
    </a-modal>
  </div>
</template>

<script>
export default {
  props: {
  },
  data() {
    return {
      previewVisible: false,
      imgStr: ''
    }
  },
  mounted() {

  },
  methods: {
    //打开大图
    openBig(data){
      this.imgStr=data
      this.previewVisible = true
    },
    //关闭大图
    handleCancel(){
      this.previewVisible = false
    },
  }
}
</script>

<style scoped>
.previewImg /deep/.ant-modal-content{
  background: none;
  box-shadow: none;
}
</style>