Skip to content
目录

图片上传

基础用法

vue
<template>
    <ws-image-upload v-bind="options"/>
</template>

<script>
    export default {
        data () {
            return {
                options: {
                    localPreview: true,
                    quantity: 5,
                    actions: {
                        url: '/system/file/addAttachment',   //上传地址,优先级高于moduleName
                        // moduleName: '',      //可根据模块名和op自动匹配上传地址,url和moduleName 择二选一
                        op: 'addAttachment'  //上传op,优先级高于moduleName
                    },
                    beforeUpdate: this.beforeUpdate,
                    afterUpload: this.afterUpload
                }

            }
        },
        methods: {
            beforeUpdate(){
                return {}
            },
            afterUpload(data) {
                return data;
            }
        }
    }
</script>

Attributes

参数说明类型默认值
actions上传配置Object{}
urlList图片地址集合,可用于修改返回图片地址Array[]
disable是否禁用Booleanfalse
inputReadyOnly是否只展示上传框,不能点击弹出文件选择框Booleanfalse
localPreview是否本地生成图片预览 异步上传Booleanfalse
multi是否可以选择多张图Booleanfalse
multiplemulti为true下,多图上传是否分多次上传Booleantrue
quantity最大上传数量, 0 为不限制Number1
size单张图片上传大小 单位 M,默认10MNumber10
isDelete是否可以删除图片Booleantrue
isViewer是否需要图片预览Booleantrue
handlePreview点击图片预览触发事件,viewer=true 生效Function-
handleRemove删除图片触发事件,delete=true生效,返回false可阻止删除图片Function-
beforeUpdate上传之前事件,返回false可取消上传,可用于传递上传参数dataFunction-
afterUpload上传成功回调函数,返回响应值Function-
asyncResolve所有异步上传执行完毕回调Function-