el-upload上传单个文件

`el-upload` 是 Element UI 提供的一个强大的文件上传组件，它支持单个文件上传、批量文件上传以及进度跟踪等功能。在 Vue.js 开发中，你可以通过以下几个步骤来使用 `el-upload`：

1. 引入依赖：首先，在 Vue 组件的模板或脚本中导入 Element UI 的 Upload 组件。

<template>
  <el-upload :action="uploadUrl" :on-success="handleSuccess" :file-list="fileList">
    <el-button slot="trigger">点击选择文件</el-button>
    <el-button type="text" slot=" tip">只能上传jpg/png文件</el-button>
  </el-upload>
</template>

2. 定义属性：设置一些必要的属性，比如 `action` 表示文件上传的服务器地址，`fileList` 存储已选文件列表，`handleSuccess` 是文件上传成功后的回调函数。

<script>
export default {
  data() {
    return {
      uploadUrl: 'your-server-url', // 你的上传接口地址
      fileList: [], // 已选择的文件列表
    };
  },
  methods: {
    handleSuccess(response, file) {
      // 成功处理文件，通常会更新状态或通知用户
      console.log('文件 "' + file.name + '" 上传成功');
      this.fileList.push(file); // 将文件添加到文件列表
    }
  }
};
</script>

3. 可选配置：还可以调整其他选项如允许的最大上传数量、是否显示预览图等。

`el-upload` 使得文件上传过程变得简单易用，并提供了丰富的交互体验。如果你有疑问或需要更详细的示例，可以随时提问哦！