Vue中点击按钮后跳转到另一个网址
时间: 2024-05-18 19:12:59 浏览: 101
在Vue中,你可以使用`router-link`或者`this.$router.push()`来实现点击按钮后跳转到另一个网址。
1. 使用`router-link`
在Vue中,你可以使用`router-link`组件来实现跳转。
首先,在你的Vue组件中导入`router-link`组件:
```
<template>
<div>
<router-link to="https://www.example.com">跳转到外部网址</router-link>
</div>
</template>
```
注意,这里的`to`属性值为你要跳转的网址。
2. 使用`this.$router.push()`
你也可以在Vue组件的方法中使用`this.$router.push()`方法来实现跳转:
```
<template>
<div>
<button @click="gotoExample">跳转到外部网址</button>
</div>
</template>
<script>
export default {
methods: {
gotoExample() {
window.location.href = 'https://www.example.com';
}
}
}
</script>
```
这里的`gotoExample`方法中使用了`window.location.href`来实现跳转。
注意,这里跳转到的是一个外部网址,如果需要跳转到内部路由,可以使用`this.$router.push()`方法。
阅读全文