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 相关文章推荐
js下用gb2312编码解码实现方法
Dec 31 Javascript
js判断当前浏览器类型,判断IE浏览器方法
Jun 02 Javascript
基于JS判断iframe是否加载成功的方法(多种浏览器)
May 13 Javascript
深入理解JavaScript单体内置对象
Jun 06 Javascript
jQuery+HTML5+CSS3制作支持响应式布局时间轴插件
Aug 10 Javascript
javascript 中的console.log和弹出窗口alert
Aug 30 Javascript
js实现把图片的绝对路径转为base64字符串、blob对象再上传
Dec 29 Javascript
如何提高Dom访问速度
Jan 05 Javascript
JQuery页面随滚动条动态加载效果的简单实现(推荐)
Feb 08 Javascript
Angular2的管道Pipe的使用方法
Nov 07 Javascript
基于Vue实现微信小程序的图文编辑器
Jul 25 Javascript
用vite搭建vue3应用的实现方法
Feb 22 Vue.js
浅谈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自动更新新闻DIY
2006/10/09 PHP
关于php连接mssql:pdo odbc sql server
2011/07/20 PHP
php图片上传存储源码并且可以预览
2011/08/26 PHP
PHP编程中的__clone()方法使用详解
2015/11/27 PHP
用PHP的socket实现客户端到服务端的通信实例详解
2017/02/04 PHP
PHP读取并输出XML文件数据的简单实现方法
2017/12/22 PHP
laravel实现于语言包的完美切换方法
2019/09/29 PHP
jquery 图片 上一张 下一张 链接效果(续篇)
2010/04/20 Javascript
JavaScript等比例缩放图片控制超出范围的图片
2013/08/06 Javascript
js对象转json数组的简单实现案例
2014/02/28 Javascript
AngularJs根据访问的页面动态加载Controller的解决方案
2015/02/04 Javascript
JavaScript实现找质数代码分享
2015/03/24 Javascript
js+div实现文字滚动和图片切换效果代码
2015/08/27 Javascript
JavaScript实现仿新浪微博大厅和腾讯微博首页滚动特效源码
2015/09/15 Javascript
使用postMesssage()实现跨域iframe页面间的信息传递方法
2016/03/29 Javascript
js实现砖头在页面拖拉效果
2020/11/20 Javascript
Javascript之面向对象--封装
2016/12/02 Javascript
vue.js实现条件渲染的实例代码
2017/06/22 Javascript
Angular之toDoList的实现代码示例
2017/12/02 Javascript
vue拖拽组件使用方法详解
2018/12/01 Javascript
vue实现计步器功能
2019/11/01 Javascript
[46:25]DOTA2上海特级锦标赛主赛事日 - 4 败者组第五轮 MVP.Phx VS EG第二局
2016/03/05 DOTA
Centos Python2 升级到Python3的简单实现
2016/06/21 Python
apache部署python程序出现503错误的解决方法
2017/07/24 Python
Python文本处理之按行处理大文件的方法
2018/04/09 Python
[原创]Python入门教程5. 字典基本操作【定义、运算、常用函数】
2018/11/01 Python
python http基本验证方法
2018/12/26 Python
Python操作redis和mongoDB的方法
2019/12/19 Python
python requests库的使用
2021/01/06 Python
详解Sticky Footer 绝对底部的两种套路
2017/11/03 HTML / CSS
简单聊聊H5的pushState与replaceState的用法
2018/04/03 HTML / CSS
电脑教师的教学自我评价
2013/11/26 职场文书
大学生职业生涯规划书范文
2014/01/14 职场文书
学徒工职责
2014/03/06 职场文书
远程网络教育毕业生自我鉴定
2014/04/14 职场文书
交通事故代理词范文
2015/05/23 职场文书