element-ui上传一张图片后隐藏上传按钮功能

 更新时间:2019年05月22日 14:52:47   转载 作者:小角色Byme  
这篇文章主要介绍了element-ui上传一张图片后隐藏上传按钮功能,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值 ,需要的朋友可以参考下

element-ui上传一张图片后隐藏上传按钮

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

:class="{hide:hideUpload}"

data里面初始值:

hideUpload: false,

limitCount:1

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

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

handleRemove里面(删除文件被调用的那个):

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

style,把scoped去掉(或者外部引入样式文件,主要目的是为了修改element-ui自带的样式)

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

PS:下面看下element-ui 上传图片时表单验证提示不消失

1.方法一:   表单元素上添加   v-model="list.length";

2.添加一个ref ,之后在on-change 事件里清空表单验证  

总结

以上所述是小编给大家介绍的element-ui上传一张图片后隐藏上传按钮功能,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

相关文章

  • intro.js 页面引导简单用法 分享

    intro.js 页面引导简单用法 分享

    这篇文章介绍了intro.js 页面引导简单用法,有需要的朋友可以参考一下
    2013-08-08
  • Javascript实现单例模式

    Javascript实现单例模式

    单例模式也称作为单子模式,更多的也叫做单体模式。为软件设计中较为简单但是最为常用的一种设计模式。这篇文章主要介绍了Javascript实现单例模式的相关资料,需要的朋友可以参考下
    2016-01-01
  • jser必看的破解javascript各种加密的反向思维方法

    jser必看的破解javascript各种加密的反向思维方法

    才发现的破解javascript各种加密的反向思维方法,大家有好的方法都跟帖啊最近发现了一个代码,加密了5层左右,我将破解到最后一步,而且不用javascript解密程序
    2007-04-04
  • layui中的switch开关实现方法

    layui中的switch开关实现方法

    今天小编就为大家分享一篇layui中的switch开关实现方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • js实现动态显示时间效果

    js实现动态显示时间效果

    本文主要介绍了js实现动态显示时间效果的实例,具有很好的参考价值。下面跟着小编一起来看下吧
    2017-03-03
  • javascript 获取多条数据(模拟ajax获取数据)

    javascript 获取多条数据(模拟ajax获取数据)

    javascript 获取多条数据(模拟ajax获取数据),这样的好处不用额外的ajax读取链接,减轻服务器负担。
    2009-06-06
  • 使用时间戳解决ie缓存的问题

    使用时间戳解决ie缓存的问题

    当编辑某条数据时,再回过头来进行编辑,会发现,里面的数据和没有编辑以前是一样的,这就是ie缓存的问题,下面是一个不错的解决方法
    2014-08-08
  • Babel 入门教程学习笔记

    Babel 入门教程学习笔记

    Babel是一个广泛使用的转码器,可以将ES6代码转为ES5代码,本篇文章主要介绍了Babel 入门教程学习笔记,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-06-06
  • 在Javascript操作JSON对象,增加 删除 修改的简单实现

    在Javascript操作JSON对象,增加 删除 修改的简单实现

    下面小编就为大家带来一篇在Javascript操作JSON对象,增加 删除 修改的简单实现。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • iscroll实现下拉刷新功能

    iscroll实现下拉刷新功能

    这篇文章主要介绍了iscroll实现下拉刷新功能的相关代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07

最新评论