【UI】饿了么 el-upload如何上传到不同的路径, 根据不同情况上传指不同的接口，不同的路径

在 Element UI 的 Upload 组件中，可以通过在 el-upload 组件中定义 before-upload 回调函数，然后根据上传文件类型等条件在函数中改变 action 属性来实现上传到不同的路径。

template中

  
  点击上传  

1
2
3
4
5
6
7
8
9

script中

methods: {  
  beforeAvatarUpload() {  
    if (判断条件) {  
      this.$refs.upload.action = 'https://example.com/upload/image'; // JPG文件上传到不同的路径  
    } else {  
      this.$refs.upload.action = 'https://example.com/upload/other'; // 其他文件上传到不同的路径  
    }  
  },  
  handleAvatarSuccess() {  
    // 上传成功后的处理逻辑  
  }  
}
1
2
3
4
5
6
7
8
9
10
11
12

beforeAvatarUpload 方法会在每次上传文件之前被调用，然后根据文件类型和大小改变上传路径。其中 this.$refs.upload.action 改变了 Upload 组件的 action 属性，这样就可以根据不同的条件上传到不同的路径了