el-upload上传
在标签上可以配置,这里推荐v-bind 动态绑定方法
参数action后面写上传到服务器端的地址(地址)

<el-upload
    class="avatar-uploader"
    ref="upload"
    list-type="picture-card"
    :action="iconImageUrl"
    :data="{fileType: form.class}"
    :file-list="[{url: form.image}]"
    :on-success="handleUploadSuccess"
    :on-remove="handleRemoveCover"
    :before-upload="beforeImageUpload">            
    <i class="el-icon-plus"></i>
</el-upload>

data参数是专门配置上传时所需的参数的。这里也用了动态绑定的方法。
在data里面定义了class。相当于配置了 fileType=category 这样的参数名和参数值
“`
form: {
class: ‘category’,
categoryName: ”,
introduction: ”,
sortShow: 0,
image: ”,
id: ”
},

on-change   可选参数, 文件状态改变时的钩子,添加文件、上传成功和上传失败时都会被调用

当然file和fileList也有用。

比如

handleRemove(file, fileList) {
console.log(file, fileList);
}
“`
这里的file是个对象,里面包含图片的一些信息。我们可以拿到file对象中的一些信息,包括图片的name,size,url 等等信息

on-remove 可选参数, 文件列表移除文件时的钩子
on-success 可选参数, 文件上传成功时的钩子

GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:3 个月前 )
c345bb45 7 个月前
a07f3a59 * Update transition.md * Update table.md * Update transition.md * Update table.md * Update transition.md * Update table.md * Update table.md * Update transition.md * Update popover.md 7 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐