vue2 antd 上传文件里面分开按钮操控

对于vue2 antd上传文件组件，可以通过设置不同的属性来实现分开按钮操控。

1. 设置showUploadList属性为false

showUploadList属性用于控制是否显示上传文件列表，设置为false后，上传的文件不会显示在列表中。

2. 使用upload组件的ref属性获取上传组件实例

ref属性可以用来获取组件的实例，可以在上传按钮的点击事件中通过实例的upload方法进行上传操作。

3. 自定义上传按钮

在上传按钮组件中添加点击事件，通过获取upload组件实例后调用upload方法进行上传操作。

完整代码示例：

<template>
  <div>
    <a-button type="primary" @click="handleUploadClick">上传文件</a-button>
    <a-upload
      ref="upload"
      :showUploadList="false"
      :action="uploadUrl"
      :headers="headers"
      :data="formData"
      :beforeUpload="beforeUpload"
      :onSuccess="onUploadSuccess"
      :onError="onUploadError"
    >
      <a-button>
        <a-icon type="upload"/> 选择文件
      </a-button>
    </a-upload>
  </div>
</template>

<script>
export default {
  data() {
    return {
      uploadUrl: '/upload',
      headers: {
        Authorization: 'Bearer token'
      },
      formData: {
        type: 'image'
      }
    }
  },
  methods: {
    handleUploadClick() {
      this.$refs.upload.upload();
    },
    beforeUpload(file) {
      console.log('before upload', file);
    },
    onUploadSuccess(response, file, fileList) {
      console.log('upload success', response, file, fileList);
    },
    onUploadError(error, file, fileList) {
      console.log('upload error', error, file, fileList);
    }
  }
};
</script>