vue有三种不同方式实现页面跳转 vue跳转页面

vue如何跳转页面？不知小伙伴们来看看小编今天的分享吧！
vue实现页面跳转的方式有三种不同。
方法一：Vue：router-lin
<router-link to="/">[跳转到主页]</router-link>
<router-link to="/login">[登录]</router-link>
<router-link to="/LOGOut">[登出]</router-link>
方法二：this.$router.push("/");
<button @click="goHome">[跳转到主页]</button>
export default {
name: "App",
methods: {
// 跳转页面法
goHome() {
this.$router.push("/");
},
}
方法三：this.$router.go(1);
<button @click="upPage">[上一页]</button>
<button @click="downPage">[下一页]</button>
upPage() {
// 后退记录相当于 history.back()
this.$router.go(-1);
},
downPage() {
// 在浏览器记录中进一步前进，相当于 history.forward()
this.$router.go(1);
}
代码示例：
<template>
<div id="app">
<img src=https://www.baikehuo.com/baike/"./Assets/logo.png">
<router-view/>
<router-link to="/">[跳转到主页]</router-link>
<router-link to="/login">[登录]</router-link>
<router-link to="/logout">[登出]</router-link>

<button @click="goHome">[跳转到主页]</button>

<button @click="upPage">[上一页]</button>
<button @click="downPage">[下一页]</button>

</div>
</template>
<script>
export default {
【vue有三种不同方式实现页面跳转 vue跳转页面】name: "App",
methods: {
// 跳转页面法
goHome() {
this.$router.push("/");
},
upPage() {
// 后退记录相当于 history.back()
this.$router.go(-1);
},
downPage() {
// 在浏览器记录中进一步前进，相当于 history.forward()
this.$router.go(1);
}
}
};
</script>
以上是小编今天的分享。我希望它能帮助你。