跳转到内容

图片裁剪上传(扩展)

使用van-uploader组件和van-popup组件,用于对指定的图片进行裁剪,并根据裁剪内容生成新的图片后将其进行上传。基于移动端图片控件编辑器扩展,编辑器样式代码名称为:CROPPING

输入参数

名称说明类型默认值
value编辑器值String-
controller编辑器控制器对象new RequiredProp(Object as PropType<C>)-
data容器数据,通常为表单数据,表格行数据,面板数据new RequiredProp(Object as PropType<IData>)-
disabled是否禁用{ type: Boolean }false
readonly是否只读{ type: Boolean, default: false }false
controlParams容器控件参数,一般是指表单部件控件参数、表格控件参数、面板控件参数{ type: Object, required: false }-

事件

名称说明类型
change值变更事件{_value:V, _name?:string, _ignore?:boolean}

编辑器参数

名称说明类型默认值
multiple是否支持选择多个图片上传booleanundefined
accept允许上传的文件类型,van-uploader组件的accept属性stringundefined
stoppropagation是否阻止默认点击booleanundefined
cropwidth裁剪宽度numberundefined
cropheight裁剪高度numberundefined
uploadparams上传参数,图片上传时,用于计算上传路径stringundefined
exportparams下载参数,图片下载时,用于计算下载路径stringundefined
osscat用于计算上传和下载路径的OSS参数stringundefined
imgcompresslimit图片压缩范围(超过该范围进行压缩,单位kb)number1024
imgcompressquality图片压缩质量(0-1,为0时不压缩,默认为0)number0
imgcompressmaxwidth压缩图片最大宽度,默认为1280pxnumber1280
appentitytag在应用启用下载授权时,用于指定当前文件所属实体。该参数值会作为验证下载权限的依据。配置格式为(应用代码名称.实体代码名称),示例:mob.masterstringundefined
datafieldtag在应用启用下载授权时,用于指定当前文件所关联的数据属性。完成配置后,将自动从容器数据(涵盖表单数据、表格行数据、面板数据)、上下文环境以及视图参数中获取该属性的实际值,将其作为验证下载权限的依据stringundefined
readonly设置编辑器是否为只读态booleanfalse
enablenoaccess是否启用无权限模式,若启用无权限模式,上传文件夹需拼接'$'字符,也不需要计算下载凭证booleanfalse
globaldownloadprifix是否使用全局文件下载前缀,若启用,则以global作为前缀booleanfalse
未来已来,立即拥抱应用融合的力量
Released under the MIT License.