vue2 antd 上传文件

可以使用Ant Design Vue提供的Upload组件来实现文件上传。具体步骤如下：

1. 安装Ant Design Vue和Axios：

npm install ant-design-vue axios --save

2. 在main.js中引入Ant Design Vue和样式：

import Vue from 'vue';
import Antd from 'ant-design-vue';
import 'ant-design-vue/dist/antd.css';

Vue.use(Antd);

3. 在组件中使用Upload组件：

<template>
  <a-upload
    :action="uploadUrl"
    :headers="headers"
    :before-upload="beforeUpload"
    :on-success="onSuccess"
  >
    <a-button icon="upload">上传文件</a-button>
  </a-upload>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      uploadUrl: 'http://localhost:3000/upload', // 上传接口
      headers: { 'Authorization': 'Bearer ' + localStorage.getItem('token') }, // 请求头部
    };
  },
  methods: {
    beforeUpload(file) {
      // 限制上传文件的类型和大小
      const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
      if (!isJpgOrPng) {
        this.$message.error('只能上传 JPG/PNG 文件!');
        return false;
      }
      const isLt2M = file.size / 1024 / 1024 < 2;
      if (!isLt2M) {
        this.$message.error('文件大小不能超过 2MB!');
        return false;
      }
      return true;
    },
    onSuccess(response) {
      this.$message.success('上传成功！');
    },
  },
};
</script>

在上面的代码中，我们定义了一个Upload组件，设置了上传接口、请求头部、限制上传文件类型和大小的beforeUpload方法和上传成功的onSuccess方法。

需要注意的是，这里使用了Axios来发送请求，所以需要在组件中引入Axios。同时，需要在请求头部中带上Authorization字段，用于校验用户是否登录。你需要根据实际情况修改这些值。

另外，如果需要在上传成功后展示上传的文件，可以在onSuccess方法中调用接口获取文件列表。