特点

CabloyJS内置了文件上传模块a-file，具有以下特点：

  • 即插即用，使用便捷
  • 支持拖拽上传
  • 支持图片剪裁
  • 支持图片、音频、及普通文件上传
  • 可将文件与原子数据相关联，继承原子数据的访问权限
  • 支持nginx服务的X-Accel-Redirect参数，提升文件下载性能

如何使用

参考页面传参与返回值的机制，直接打开文件上传页面，传入参数，然后获取后端返回的文件下载信息即可

test-party/front/src/kitchen-sink/pages/fileUpload.vue

onPerformImageFixed() {
  return new Promise((resolve, reject) => {
    this.$view.navigate('/a/file/file/upload', {
      context: {
        params: {
          mode: 1,
          // atomId: 0,
          fixed: {
            width: 400,
            height: 200,
          },
        },
        callback: (code, data) => {
          if (code === 200) {
            this.imageUrlFixed = data.downloadUrl;
            resolve();
          }
          if (code === false) {
            reject();
          }
        },
      },
    });
  });
},

页面路径

绝对路径：/a/file/file/upload

传入参数

名称 说明
mode 上传模式：1: 图片，2: 普通文件，3: 音频
atomId 与文件关联的atomId，当mode=2时，继承原子数据的访问权限
flag 文件标记，可依据应用场景设定自定义值
fixed 固定图片尺寸

返回值

名称 说明
fileId 文件Id
realName 文件名称
downloadId 文件下载Id
downloadUrl 文件下载地址