vue3实现在新标签中打开指定网址的方法
更新时间：2024年07月25日 09:49:36 作者：Python私教
我希望点击查看按钮的时候,能够在新的标签页面打开这个文件的地址进行预览,该如何实现呢,下面小编给大家带来了基于vue3实现在新标签中打开指定的网址,感兴趣的朋友跟随小编一起看看吧
有一个文件列表，如下图：
我希望点击查看按钮的时候，能够在新的标签页面打开这个文件的地址进行预览，该如何实现呢？
比如：
实际上要实现这个并不难，参考demo如下：
首先，给按钮绑定点击事件：
<a-button
size="small"
type="primary"
@click="handleView(record)"
>
查看
</a-button>然后，实现点击方法：
const handleView = (record) => {
const url = `/api/download/${record.uuid}_${record.name}`
window.open(url, "_blank")
}最终就实现了这个功能！！！
到此这篇关于vue3实现在新标签中打开指定的网址的文章就介绍到这了,更多相关vue3新标签打开指定的网址内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了vue.set向对象里增加多层数组属性不生效问题及解决，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
这篇文章主要介绍了vue项目在env文件中设置的变量无效问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
这篇文章主要为大家详细介绍了vue.js开发环境的安装教程，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-03-03
这篇文章主要介绍了Vue 项目运行完成后自动打开浏览器的多种实现方法，方法一比较适用于vue3，每种方法通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友参考下吧2022-02-02
这篇文章主要为大家详细介绍了vue实现pdf文档在线预览功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-11-11
这篇文章主要为大家介绍了Vue 2源码解读$mount原理示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-08-08
v-model 指令在表单控件元素上创建双向数据绑定,所谓双向绑定。这篇文章主要介绍了Vue.js中v-bind v-model的使用和区别,需要的朋友可以参考下2018-12-12
这篇文章主要介绍了vue里面的el-select绑定默认值方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-09-09
Rsbuild,一个基于Rspack的高效Web构建工具,将Rspack的强大功能与易用性相结合,是你项目搭建的不二之选,Rsbuild不仅提供了开箱即用的体验,还引入了高性能的构建机制,本文给大家介绍了Vue2迁移Rsbuild详细步骤,需要的朋友可以参考下2024-10-10
这篇文章主要介绍了关于Vue中v-show中添加表达式用于判断是否显示的问题,很多朋友经常会遇到这样的需求，有数据来源和标签类型两行选项，需要实现点击上面的某个数据来源时，标签类型自动切换功能，感兴趣的朋友一起看看吧2018-03-03
最新评论