Vue Antdv 上传组件（a-upload、a-upload-dragger）二次封装（DZMAntdvUpload）

在使用 Antdv 上传组件 a-upload、a-upload-dragger 的时候，尤其是允许 选择多文件上传 的时候，可能需要检测 文件重复、文件大小、图片尺寸、图片比例、视频尺寸、视频比例、错误不需要重复提示、批量文件一个不符合都不要进行上传 等常用功能

扩展功能支持列表，打开之后，稍微往中间滚一滚。

这里将这些功能都封装到了一起，在完全支持原生自带属性的同时，并扩展支持更多常用便利功能，方便开发中节省时间。

DZMAntdvUpload 使用，源码注释多，使用简单，扩展性高。

上传组件 UI、样式 支持 slot 全部重写自定义。

<template>
  <div class="home-view">

    <!-- 上传组件 -->
    <upload :customRequestPro="customRequestPro" :beforeUploadPro="beforeUploadPro"></upload>

    <!-- 启用拖拽上传组件 -->
    <upload :isDragger="true" :customRequestPro="customRequestPro" :beforeUploadPro="beforeUploadPro"></upload>

    <!-- 上传组件 -->
    <!-- <upload :customRequestPro="customRequestPro">
      <span slot="up-title">三水上传</span>
    </upload> -->

    <!-- 上传组件 - 自定义 -->
    <!-- <upload :customRequestPro="customRequestPro" :disabled="true"> -->
      <!-- 自定义上传UI -->
      <!-- <template slot="up-slot" slot-scope="props"> -->
        <!-- 使用内部禁用属性 -->
        <!-- <a-button :disabled="props.disabled">三水上传Pro</a-button> -->
        <!-- 不使用内部禁用属性 -->
        <!-- <a-button>三水上传Pro</a-button>
      </template>
    </upload> -->

  </div>
</template>

<script>
// 导入组件
import Upload from '@/components/Upload'
export default {
  components: {
    Upload
  },
  methods: {
    // 准备上传
    beforeUploadPro () {
      // return true
      return new Promise((resolve, reject) => {
        resolve()
      })
    },
    customRequestPro (data, fileJson, result) {
      // 上传完成
      setTimeout(() => {
        result(true)
      }, 2000)
    }
  }
}
</script>

<style scoped>
.home-view {
  display: flex;
  align-items: center;
  justify-content: center;
}
</style>