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 相关文章推荐
window.open不被拦截的实现代码
Aug 22 Javascript
jQuery中filter()和find()的区别深入了解
Sep 25 Javascript
JavaScript获取路径设计源码
May 22 Javascript
利用js查找数组中指定元素并返回该元素的所有索引示例
Mar 29 Javascript
JS实现点击循环切换显示内容的方法
Oct 19 Javascript
jQuery判断网页是否已经滚动到浏览器底部的实现方法
Oct 27 jQuery
vue-resource post数据时碰到Django csrf问题的解决
Mar 13 Javascript
javascript 数组(list)添加/删除的实现
Dec 17 Javascript
详解基于element的区间选择组件校验(交易金额)
Jan 07 Javascript
微信小程序canvas实现签名功能
Jan 19 Javascript
JavaScript架构搭建前端监控如何采集异常数据
Jun 25 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
php数组函数序列之asort() - 对数组的元素值进行升序排序,保持索引关系
2011/11/02 PHP
php通过strpos查找字符串出现位置的方法
2015/03/17 PHP
PHP表单验证内容是否为空的实现代码
2016/11/14 PHP
关于laravel 子查询 &amp; join的使用
2019/10/16 PHP
学习ExtJS Window常用方法
2009/10/07 Javascript
Extjs TriggerField在弹出窗口显示不出问题的解决方法
2010/01/08 Javascript
JavaScript Perfection kill 测试及答案
2010/03/23 Javascript
js/jQuery简单实现选项卡功能
2014/01/02 Javascript
JSF中confirm弹出框的用法示例介绍
2014/01/07 Javascript
一些老手都不一定知道的JavaScript技巧
2014/05/06 Javascript
让IE8浏览器支持function.bind()方法
2014/10/16 Javascript
js中的json对象详细介绍
2014/10/29 Javascript
js验证身份证号有效性并提示对应信息
2015/10/19 Javascript
基于Bootstrap的网页设计实例
2017/03/01 Javascript
微信小程序获取手机系统信息的方法【附源码下载】
2017/12/07 Javascript
浅谈react受控组件与非受控组件(小结)
2018/02/09 Javascript
Vue三层嵌套路由的示例代码
2018/05/05 Javascript
vue.js配合$.post从后台获取数据简单demo分享
2018/08/11 Javascript
Node.js 使用request模块下载文件的实例
2018/09/05 Javascript
使用vuex较为优雅的实现一个购物车功能的示例代码
2019/12/09 Javascript
详解钉钉小程序组件之自定义模态框(弹窗封装实现)
2020/03/07 Javascript
Vue的props父传子的示例代码
2020/05/20 Javascript
Python中获取网页状态码的两个方法
2014/11/03 Python
Python __setattr__、 __getattr__、 __delattr__、__call__用法示例
2015/03/06 Python
Android 兼容性问题:java.lang.UnsupportedOperationException解决办法
2017/03/19 Python
python自动重试第三方包retrying模块的方法
2018/04/24 Python
python2与python3共存问题的解决方法
2018/09/18 Python
浅谈python处理json和redis hash的坑
2020/07/16 Python
澳大利亚家具和家居用品在线:BROSA
2017/11/02 全球购物
FOREO斐珞尔官方旗舰店:LUNA露娜洁面仪
2018/03/11 全球购物
自我鉴定 电子商务专业
2014/01/30 职场文书
大学生见习报告范文
2014/11/03 职场文书
公务员年终个人总结
2015/02/12 职场文书
回复函格式及范文
2015/07/14 职场文书
离婚协议书范本(2016最新版)
2016/03/18 职场文书
Django中的JWT身份验证的实现
2021/05/07 Python