el-upload选择文件后缀

el-upload组件默认支持所有类型的文件上传，如果需要限制文件类型，可以使用accept属性。例如，如果只允许上传图片文件，可以设置accept属性为'image/*'，如果只限制上传excel文件，可以设置accept属性为'application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'。具体用法如下：

<el-upload
  :action="uploadUrl"
  :accept="'image/*'"
>
  <el-button slot="trigger">上传文件</el-button>
</el-upload>

相关问题

el-upload上传文件如何检验文件后缀

el-upload组件可以通过设置accept属性来限制上传文件的类型，例如限制只上传图片文件可以设置accept为"image/*"。此外，也可以通过设置before-upload属性来在上传前进行自定义校验，可以通过判断文件后缀名来进行限制。需要注意的是，前端校验仅仅是一种辅助手段，还需要在后端进行二次校验，以确保上传的文件符合安全规范。

el-upload 改后缀

根据提供的引用内容，el-upload 改后缀的方法如下：

1. 通过修改组件底层代码实现。这种方法需要对组件底层代码有一定的了解，不建议使用。

2. 在钩子函数 beforeUpload 中获取到上传的文件后，修改文件名，然后再上传。具体代码如下：

<el-upload
  class="upload-demo"
  action="/upload"
  :before-upload="beforeUpload"
  :on-success="onSuccess"
  :on-error="onError"
  :file-list="fileList">
  <el-button size="small" type="primary">点击上传</el-button>
</el-upload>

<script>
export default {
  data() {
    return {
      fileList: []
    };
  },
  methods: {
    beforeUpload(file) {
      // 获取文件名和后缀
      const fileName = file.name.split('.')[0];
      const extName = file.name.split('.')[1];
      // 修改文件名
      file.name = `${fileName}.new.${extName}`;
      // 返回修改后的文件
      return file;
    },
    onSuccess(response, file, fileList) {
      // 上传成功的回调函数
    },
    onError(err, file, fileList) {
      // 上传失败的回调函数
    }
  }
};
</script>

在 beforeUpload 钩子函数中，我们获取到上传的文件后，先将文件名和后缀分离出来，然后修改文件名，最后返回修改后的文件即可。这样上传的文件名就会被修改为原文件名加上 .new 后缀的形式。