Element: upload 上传组件 照片墙

[yanzaocheng]

没有一个接口可以隐藏上传组件。比如我想限制上传5张 ，上传到第五张，上传组件隐藏

这个api before-upload 这个api 返回false 还是会添加图片 只是没有上传而已 有bug

[baiyaaaaa]

现有的API能够实现你的需求，自己找思路吧

[yanzaocheng]

有个api before-upload 这个api 返回false 还是会添加图片 只是没有上传而已 有bug

[maxwelltsai1536]

这个问题可以在uploadsuccess的时候通过修改当前的filesList来解决 检测出现大小问题之后 将无效的fileList从回调的fileList中移除 再将回调的fileList赋值给upload的fileList即可

[lkiarest]

请问这个问题解决了吗？ api里没有limit之类的参数，莫非要用 jquery 去隐藏那个加号图标么？

[lebuslebos]

我用的是是手动上传的照片墙组件。

el-upload里面绑定一个占位class：

:class="{hide:hideUpload}"

data里面初始值：

hideUpload: false,

onChange里面（添加文件、上传成功和上传失败时都会被调用的那个）：

this.hideUpload = fileList.length >= this.limitCount;

handleRemove里面（删除文件被调用的那个）：

this.hideUpload = fileList.length >= this.limitCount;

style，把scoped去掉：

<style>
.hide .el-upload--picture-card {
    display: none;
}
</style>

[dengxiaozhen]

@lebuslebos style，把scoped去掉 会影响到其他样式的吧

[kid1412621]

超限了要怎么隐藏上传区域?就那个+号那块

[coder-sango]

@lebuslebos style，把scoped去掉 会影响到其他样式的吧

不去掉的话怎么影响element的样式呢...

[xuech]

我用的是是手动上传的照片墙组件。

el-upload里面绑定一个占位class：

:class="{hide:hideUpload}"

data里面初始值：

hideUpload: false,

onChange里面（添加文件、上传成功和上传失败时都会被调用的那个）：

this.hideUpload = fileList.length >= this.limitCount;

handleRemove里面（删除文件被调用的那个）：

this.hideUpload = fileList.length >= this.limitCount;

style，把scoped去掉：

<style>
.hide .el-upload--picture-card {
    display: none;
}
</style>

可以，谢谢了

[thk9]

可以利用 ref="ID"
:on-remove="判定已经上传的图片列表的长度， 小于目标数量就显示 + "
:on-exceed="超过数量显示就提示， 注意是验证 file 的 length"
:on-change="如果达到目标数量就隐藏"

onChange 中关键性代码
const d = this.$refs["ID"]
d.$children[1].$el.style.display = 'none'
onRemove 中关键性代码
const d = this.$refs["ID"]
d.$children[1].$el.style.display = ''

[lkiarest]

这个功能应该作为组件的基本功能来提供，其他 hack 的方式没有必要

[jiangmintun123]

@lebuslebos style，把scoped去掉 会影响到其他样式的吧

不去掉的话怎么影响element的样式呢...

这样写不去掉scoped也可以/deep/.hide .el-upload--picture-card {
display: none;
}

[babyfacer0104]

我用的是是手动上传的照片墙组件。

el-upload里面绑定一个占位class：

:class="{hide:hideUpload}"

data里面初始值：

hideUpload: false,

onChange里面（添加文件、上传成功和上传失败时都会被调用的那个）：

this.hideUpload = fileList.length >= this.limitCount;

handleRemove里面（删除文件被调用的那个）：

this.hideUpload = fileList.length >= this.limitCount;

style，把scoped去掉：

<style>
.hide .el-upload--picture-card {
    display: none;
}
</style>

scoped不用去掉，可以写成/deep/

[yongfeng-peng]

用你们的方法还是不行呀？上传的也被隐藏了