vue实现点击按钮下载文件功能


Posted in Javascript onOctober 11, 2019

vue实现点击按钮下载文件功能

项目中需要用到文件下载功能,查了资料发现需要用到a标签的特性,但是这边需要用到点击按钮下载,懒得写样式,于是用了以下代码.

<div class="btns">
 	<el-button size="mini" type="primary" @click="$router.push(`/portal/${item.id}/detail`)">查看软件</el-button>
  <el-link target="_blank" :href="item.sourceUrl | filterUrl" :underline="false" style="margin-left:15px">
    <el-button size="mini" type="warning">软件下载</el-button>
  </el-link>
</div>

在el-button的外面套了一层el-link,如下图,可以正常下载

vue实现点击按钮下载文件功能

以下是el-link文字链接的属性

vue实现点击按钮下载文件功能

总结

以上所述是小编给大家介绍的vue实现点击按钮下载文件功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
Firefox outerHTML实现代码
Jun 04 Javascript
js 学习笔记(三)
Dec 29 Javascript
jquery插件validate验证的小例子
May 08 Javascript
jQuery前端框架easyui使用Dialog时bug处理
Dec 05 Javascript
jQuery中die()方法用法实例
Jan 19 Javascript
浅谈javascript中for in 和 for each in的区别
Apr 23 Javascript
DeviceOne 让你一见钟情的App快速开发平台
Feb 17 Javascript
浅谈js里面的InttoStr和StrtoInt
Jun 14 Javascript
JS日程管理插件FullCalendar简单实例
Feb 07 Javascript
bootstrap select2插件用ajax来获取和显示数据的实例
Aug 09 Javascript
如何用RxJS实现Redux Form
Dec 29 Javascript
微信小程序返回上一页传参并刷新过程解析
Dec 13 Javascript
浅谈TypeScript 用 Webpack/ts-node 运行的配置记录
Oct 11 #Javascript
详解vue 自定义组件使用v-model 及探究其中原理
Oct 11 #Javascript
JsonProperty 的使用方法详解
Oct 11 #Javascript
vue element upload组件 file-list的动态绑定实现
Oct 11 #Javascript
解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题
Oct 11 #Javascript
微信小程序 点击切换样式scroll-view实现代码实例
Oct 11 #Javascript
vue控制多行文字展开收起的实现示例
Oct 11 #Javascript
You might like
德劲1107的电路分析与打磨
2021/03/02 无线电
PHP中的超全局变量
2006/10/09 PHP
ThinkPHP的URL重写问题
2014/06/22 PHP
学习php设计模式 php实现门面模式(Facade)
2015/12/07 PHP
PHP判断json格式是否正确的实现代码
2017/09/20 PHP
Laravel模型间关系设置分表的方法示例
2018/04/21 PHP
基于jQuery的Tab选项框效果代码(插件)
2011/03/01 Javascript
用jquery和json从后台获得数据集的代码
2011/11/07 Javascript
jQuery获取注册信息并提示实现代码
2013/04/21 Javascript
Javascript中查找不以XX字符结尾的单词示例代码
2013/10/15 Javascript
jquery实现全选和全不选功能效果的实现代码【推荐】
2016/05/05 Javascript
nodejs利用http模块实现银行卡所属银行查询和骚扰电话验证示例
2016/12/30 NodeJs
jQuery基于事件控制实现点击显示内容下拉效果
2017/03/07 Javascript
微信小程序picker组件简单用法示例【附demo源码下载】
2017/12/05 Javascript
Vue.directive()的用法和实例详解
2018/03/04 Javascript
原生JS实现的碰撞检测功能示例
2018/05/18 Javascript
JavaScript this绑定过程深入详解
2018/12/07 Javascript
微信小程序使用setData修改数组中单个对象的方法分析
2018/12/30 Javascript
解决vue-cli webpack打包开启Gzip 报错问题
2019/07/24 Javascript
基于axios 的responseType类型的设置方法
2019/10/29 Javascript
用js实现放大镜效果
2020/10/28 Javascript
Python实时获取cmd的输出
2015/12/13 Python
PyChar学习教程之自定义文件与代码模板详解
2017/07/17 Python
python实现mean-shift聚类算法
2020/06/10 Python
最简单的matplotlib安装教程(小白)
2020/07/28 Python
纯css3显示隐藏一个div特效的具体实现
2014/02/10 HTML / CSS
如何使用css3实现一个类在线直播的队列动画的示例代码
2020/06/17 HTML / CSS
JAVA和C++区别都有哪些
2015/03/30 面试题
自我推荐书
2013/12/04 职场文书
个人社会实践自我鉴定
2014/03/24 职场文书
幼儿园大班区域活动总结
2014/07/09 职场文书
2015年公务员试用期工作总结
2015/05/28 职场文书
golang日志包logger的用法详解
2021/05/05 Golang
React中的Context应用场景分析
2021/06/11 Javascript
Mysql实现简易版搜索引擎的示例代码
2021/08/30 MySQL
笔记本自带的win11如何跳过联网激活?
2022/04/20 数码科技