💻前端小技巧 | Vue中使用`window.open`实现带参数跳转😎

发布时间：2025-03-21 13:34:00来源：

在Vue项目开发中，我们有时需要通过`window.open`方法打开新页面并传递参数。比如，当用户点击按钮时，希望跳转到另一个页面，并附带一些查询参数。以下是实现方法👇：

首先，在Vue组件中定义一个方法来处理跳转逻辑：

```javascript

methods: {

openNewPage() {

const param = 'id=123&name=test';

window.open(`/target-page?${param}`, '_blank');

}

```

这样，当用户点击触发`openNewPage`方法时，会新开一个标签页，地址栏将显示类似`/target-page?id=123&name=test`的URL。这种方式非常适合需要动态传递参数的场景。

需要注意的是，`_blank`参数确保了链接在新窗口或标签页中打开，避免干扰当前页面的用户体验。🌟

通过这种方法，我们可以轻松地在Vue项目中实现带有参数的外部跳转功能！💪

标签：

免责声明：本答案或内容为用户上传，不代表本网观点。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。如遇侵权请及时联系本站删除。