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 相关文章推荐
javascript new一个对象的实质
Jan 07 Javascript
js中定义一个变量并判断其是否为空的方法
May 13 Javascript
javascript中var的重要性分析
Feb 11 Javascript
JavaScript中判断变量是数组、函数或是对象类型的方法
Feb 25 Javascript
JavaScript获取DOM元素的11种方法总结
Apr 25 Javascript
Jquery easyui开启行编辑模式增删改操作
Jan 14 Javascript
javascript中的 object 和 function小结
Aug 14 Javascript
jQuery中常用动画效果函数(日常整理)
Sep 17 Javascript
详解微信第三方小程序代开发
Jun 23 Javascript
webuploader实现上传图片到服务器功能
Aug 16 Javascript
微信小程序批量监听输入框对按钮样式进行控制的实现代码
Oct 12 Javascript
JavaScript 实现HTML DOM增删改查操作的常见方法详解
Jan 04 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
Chrome Web App开发小结
2014/09/04 PHP
浅谈php优化需要注意的地方
2014/11/27 PHP
PHP设计模式概论【概念、分类、原则等】
2020/05/01 PHP
javascript判断单选框或复选框是否选中方法集锦
2007/04/04 Javascript
Mootools 1.2教程 滑动效果(Slide)
2009/09/15 Javascript
JS+DIV实现鼠标划过切换层效果的实例代码
2013/11/26 Javascript
JavaScript字符串对象charAt方法入门实例(用于取得指定位置的字符)
2014/10/17 Javascript
jQuery中:disabled选择器用法实例
2015/01/04 Javascript
基于jquery css3实现点击动画弹出表单源码特效
2015/08/31 Javascript
JS插件overlib用法实例详解
2015/12/26 Javascript
js关于getImageData跨域问题的解决方法
2016/10/14 Javascript
详解Vue webapp项目通过HBulider打包原生APP
2018/06/29 Javascript
JS如何获取地址栏的参数实例讲解
2018/10/06 Javascript
详解mpvue实现对苹果X安全区域的适配
2019/07/31 Javascript
微信小程序修改checkbox的样式代码实例
2020/01/21 Javascript
Vue data的数据响应式到底是如何实现的
2020/02/11 Javascript
python PyTorch预训练示例
2018/02/11 Python
pandas Dataframe行列读取的实例
2018/06/08 Python
使用Numpy读取CSV文件,并进行行列删除的操作方法
2018/07/04 Python
在python中只选取列表中某一纵列的方法
2018/11/28 Python
画pytorch模型图,以及参数计算的方法
2019/08/17 Python
Python 实现try重新执行
2019/12/21 Python
python 如何快速复制序列
2020/09/07 Python
Python根据URL地址下载文件并保存至对应目录的实现
2020/11/15 Python
澳大利亚头发和美容产品购物网站:OZ Hair & Beauty
2020/03/27 全球购物
Linux操作面试题
2012/05/16 面试题
班级文化建设标语
2014/06/23 职场文书
音乐幼师求职信
2014/07/09 职场文书
关于清明节的演讲稿
2014/09/13 职场文书
机关作风建设工作总结
2014/10/23 职场文书
寻衅滋事罪辩护词
2015/05/21 职场文书
导游词之茶卡盐湖
2019/11/26 职场文书
python实现高效的遗传算法
2021/04/07 Python
springboot使用Redis作缓存使用入门教程
2021/07/25 Redis
Python字符串格式化方式
2022/04/07 Python
MySQL 外连接语法之 OUTER JOIN
2022/04/09 MySQL