Naming Prosecution Mitigator

    @shihuo/upload-component

    2.0.6 • Public • Published

    统一上传组件

    @shihuo/upload-component

    基于 fusion Upload 组件,实现统一的上传配置入口,支持所有用法,特殊用法和说明你请看下方 API 和实际使用用例

    @alifd/next 版本: ^1.19.8

    API

    参数名 说明 必填 类型 默认值 备注
    validate 校验模式 boolean false 开启后自定校验字段生效。
    默认情况下用法等同fusion的Upload组件
    shape 上传按钮形状 enum 在fusion的upload组件的shape配置基础上新增integrate,展示整合组件模式
    v2.0.4
    preventMessage 阻止内置提示框弹出 boolean false
    volume 文件大小限制 number 2 文件大小最大限制,可输入浮点数
    单位:M
    ratio 宽高比 string/number/Array 1:1 预设 1:1、3:4选项
    支持传入字符串格式 "数字:数字"
    如:10:7 表示宽/高必须10/7
    支持传入数字:值表示宽/高
    支持传入数组:其中一种宽高比通过即校验通过
    widthRange 宽度范围 number/string/Array [600, 2500] null表示不限宽
    number以及字符串数字表示固定宽度
    heightRange 高度范围 number/string/Array [600, 2500] 同withRange
    beforeUploadVolumeError function beforeUpload阶段【文件大小】校验不通过触发
    反参:
    {errorMessage}, file, reader, options
    beforeUploadRatioError function beforeUpload阶段【比例】校验不通过触发
    反参:
    {errorMessage}, file, reader, options
    beforeUploadSizeError function beforeUpload阶段【尺寸】校验不通过触发
    反参:
    {errorMessage}, file, reader, options
    onValidateError 整体校验错误回调 function: () => object 反参:
    {
    volume: boolean 【false大小校验不通过】
    volumeError: 错误信息
    ratio: boolean【false宽高比校验不通过】
    ratioError
    size: boolean 【false尺寸校验不通过】
    sizeError
    }
    file:文件对象
    reader:FileReader
    options:beforeUpload透传的options
    blockCheck 阻断校验 boolean false 设置true情况:校验不通过时立即停止继续执行。
    执行对应beforeUpload错误回调函
    数。并执行onValidateError回调
    dataURLToFile base64转换成file对象 function v1.1.2
    Validator 校验器 class 校验器入参volume、ratio、widthRange、heightRange
    onOpenTool 打开素材库回调 传入时显示打开素材库按钮
    仅shape=integrate或Upload.Integrate生效
    v2.0.0

    注意:组件内部预定义了上传配置,覆盖action后内置上传配置失效,同时内置formatter配置失效。

    Upload.dataURLToFile

    base64转换成file对象

    入参:base64字符串,文件名称,自定义mime

    const file = Upload.dataURLToFile('data:image;xxxxx', '文件名', 'mime');

    v1.1.2+

    Upload.Validator

    校验器

    入参: volume、ratio、widthRange、heightRange

    const validator = new Validator({ volume: 2, ratio: 1, widthRange: [600, 2500], heightRange: [600, 2500] });
    // 单独校验文件大小
    // @params total 文件大小
    // @return object: 
    // volume: boolean 是否校验通过,true通过,false不通过。
    // volumeError: string 错误信息
    const volumeResult = validator.validateVolume(total);
    // 单独校验宽高比例
    // @params width
    // @params height
    // @return object: 
    // ratio: boolean 是否校验通过,true通过,false不通过。
    // ratioError: string 错误信息
    const ratioResult = validator.validateVolume(width, height);
    // 单独校验宽高范围
    // @params width
    // @params height
    // @return object: 
    // size: boolean 是否校验通过,true通过,false不通过。
    // sizeError: string 错误信息
    const sizeResult = validator.validateRange(width, height);
    
    // 综合校验
    // @params width 宽
    // @params height 高
    // @params total 大小
    // @return object:
    // volume: boolean 是否校验通过,true通过,false不通过。
    // volumeError: string 错误信息
    // ratio: boolean 是否校验通过,true通过,false不通过。
    // ratioError: string 错误信息
    // size: boolean 是否校验通过,true通过,false不通过。
    // sizeError: string 错误信息
    // errorMessage: 总的错误信息
    const error = validator.exec({ width, height, total });

    v1.1.2+

    Upload.ACTION
    Upload.NAME
    Upload.ACCEPT
    Upload.WITH_CREDENTIALS
    Upload.VOLUME
    Upload.WIDTH_RANGE
    Upload.HEIGHT_RANGE
    Upload.RATIO

    Install

    npm i @shihuo/upload-component

    DownloadsWeekly Downloads

    469

    Version

    2.0.6

    License

    MIT

    Unpacked Size

    1.35 MB

    Total Files

    32

    Last publish

    Collaborators

    • yubowei
    • jiaqingxu
    • zhaozhengbo
    • shawnsong