Skip to content

上传组件

Jump to bottom
白開水 edited this page Mar 27, 2023 · 3 revisions

layui upload 文档

上传参数

参数 说明 类型 是否必填 默认值 备注
data-upload 上传选中的input string 是
data-upload-number 单传还是多传 string 是 one one/more
data-upload-exts 限制上传的文件类型 string 否 * 使用分割符连接，如 zip|rar|7z
data-upload-icon 文件失效时显示图标 string 否 image 可选值有：doc、file、image、mp3、mp4、pdf、ppt、rar、txt、visio、xls、zip
data-upload-sign 多文件拼接的分割符 string 否 |
data-upload-accept 指定允许上传时校验的文件类型 string 否 file 可选值有：images（图片）、file（所有文件）、video（视频）、audio（音频）
data-upload-mimetype 规定打开文件选择框时，筛选出的文件类型 string 否 值为用逗号隔开的 MIME 类型列表。如：acceptMime: 'image/*'（只显示图片文件）acceptMime: 'image/jpg, image/png'（只显示 jpg 和 png 文件）

选择参数

参数 说明 类型 是否必填 默认值 备注
id 容器唯一的ID值 string 是
data-upload-select 下拉选中的input 的 name 属性值 string 是
data-upload-number 单传还是多传 string 是 one
data-upload-exts 限制选择的文件类型 string 否 * 使用分割符连接，如 zip|rar|7z

代码示例

<div class="layui-form-item">
    <label class="layui-form-label required">商品LOGO</label>
    <div class="layui-input-block layuimini-upload">
        <input name="logo" class="layui-input layui-col-xs6" lay-verify="required" placeholder="请上传分类图片" value="{$row.logo|default=''}">
        <div class="layuimini-upload-btn">
            <span><a class="layui-btn" data-upload="logo" data-upload-number="one" data-upload-exts="png|jpg|ico|jpeg" data-upload-icon="image"><i class="fa fa-upload"></i> 上传</a></span>
            <span><a class="layui-btn layui-btn-normal" id="select_logo" data-upload-select="logo" data-upload-number="one" data-upload-mimetype="image/*"><i class="fa fa-list"></i> 选择</a></span>
        </div>
    </div>
</div>
Clone this wiki locally