使用vue3+ts antdesign实现多文件的上传

可以使用Ant Design Vue的Upload组件来实现多文件上传。下面是一个基本的示例：

<template>
  <a-upload
    :action="uploadUrl"
    :multiple="true"
    :before-upload="beforeUpload"
    :on-success="onSuccess"
    :on-error="onError"
  >
    <a-button>
      <a-icon type="upload" /> 点击上传
    </a-button>
  </a-upload>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
import { Upload, Button, Icon, message } from 'ant-design-vue';

export default defineComponent({
  components: { Upload, Button, Icon },
  data() {
    return {
      uploadUrl: '/api/upload',
    };
  },
  methods: {
    beforeUpload(file: File) {
      const isLt2M = file.size / 1024 / 1024 < 2;
      if (!isLt2M) {
        message.error('上传文件大小不能超过 2MB!');
      }
      return isLt2M;
    },
    onSuccess(response: any, file: File, fileList: File[]) {
      console.log(response);
      console.log(fileList);
      message.success(`${file.name} 上传成功`);
    },
    onError(error: any, file: File) {
      console.log(error);
      message.error(`${file.name} 上传失败`);
    },
  },
});
</script>

上述代码中，我们使用了`<a-upload>`组件来实现多文件上传，并设置了`action`属性为上传的接口地址。`multiple`属性表示是否允许多个文件上传。`before-upload`方法用于在上传之前对文件进行校验，例如文件大小的限制。`on-success`和`on-error`方法分别在文件上传成功和失败时触发，我们可以在这里处理上传结果并给用户提示信息。

另外，我们还需要在`<script>`标签中引入Ant Design Vue中的组件，并在`<template>`标签中使用它们来实现页面布局。