vue点击跳转到传入的网址·代码实现
时间: 2023-08-05 19:37:56 浏览: 83
vue项目中跳转到外部链接的实例讲解
你可以通过以下代码实现在点击按钮后跳转到传入的网址:
1. 在你的 Vue 组件中添加一个按钮,并为它绑定一个点击事件:
```html
<template>
<div>
<button @click="goToUrl('https://www.example.com')">跳转到网址</button>
</div>
</template>
```
2. 在组件的 methods 中定义一个名为 goToUrl 的方法,用于跳转到传入的网址:
```javascript
<script>
export default {
name: 'MyComponent',
methods: {
goToUrl(url) {
window.location.href = url;
}
}
}
</script>
```
3. 当用户点击按钮时,就会触发 goToUrl 方法,并且将传入的网址作为参数传递给该方法,从而跳转到传入的网址。
注意:在上述代码中,我们直接使用了 window.location.href 属性来指定跳转的 URL,这种方式会直接打开一个新的页面。如果你需要在当前页面中打开链接,可以使用 Vue Router 或者其他前端路由库来实现。
阅读全文