vue代码执行el-upload

el-upload 是 ElementUI 中的一个上传组件，使用时需要在 Vue 组件中引入该组件并进行配置。下面是一个简单的示例：

<template>
  <el-upload
    class="upload-demo"
    action="/upload"
    :on-success="handleSuccess"
    :before-upload="beforeUpload"
    :file-list="fileList"
    multiple>
    <el-button size="small" type="primary">点击上传</el-button>
    <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
  </el-upload>
</template>

<script>
export default {
  data() {
    return {
      fileList: []
    };
  },
  methods: {
    handleSuccess(response, file, fileList) {
      console.log(response);
    },
    beforeUpload(file) {
      const isJPG = file.type === 'image/jpeg' || file.type === 'image/png';
      const isLt2M = file.size / 1024 / 1024 < 2;

      if (!isJPG) {
        this.$message.error('上传头像图片只能是 JPG/PNG 格式!');
      }
      if (!isLt2M) {
        this.$message.error('上传头像图片大小不能超过 2MB!');
      }
      return isJPG && isLt2M;
    }
  }
};
</script>

在上面的代码中，我们首先引入了 el-upload 组件，并在 template 中使用了该组件。其中，class 属性用于设置样式，action 属性用于设置上传地址，on-success 属性用于设置上传成功后的回调函数，before-upload 属性用于设置上传前的回调函数，file-list 属性用于设置已上传的文件列表，multiple 属性用于设置是否支持多选。

在 script 中，我们定义了一个 data 对象，其中包含一个 fileList 数组，用于存储已上传的文件列表。同时，我们定义了两个方法：handleSuccess 和 beforeUpload。handleSuccess 方法用于处理上传成功后的回调函数，beforeUpload 方法用于处理上传前的回调函数。在 beforeUpload 方法中，我们可以对上传的文件进行一些限制，例如文件类型、文件大小等。