vue怎么实现页面跳转
在 Vue 中,可以使用 vue-router 插件来实现页面跳转。首先需要在 main.js 文件中引入 vue-router 并配置好路由。然后在组件中使用标签或者 this.$router.push() 方法来实现页面跳转。示例:1.main.js 中引入并配置路由import Vue from 'vue'import Router from 'vue-router'Vue....
·
在 Vue 中,可以使用 vue-router 插件来实现页面跳转。首先需要在 main.js 文件中引入 vue-router 并配置好路由。然后在组件中使用 标签或者 this.$router.push() 方法来实现页面跳转。
示例:
1.main.js 中引入并配置路由
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/about',
name: 'about',
component: About
}
]
})
2.使用 标签在页面中实现页面跳转
<template>
<div>
<router-link to="/">Home</router-link>
<router-link to="/about">About</router-link>
</div>
</template>
3.使用 this.$router.push() 方法在组件中实现页面跳转
<template>
<div>
<button @click="goHome">Home</button>
</div>
</template>
<script>
export default {
methods: {
goHome() {
this.$router.push('/')
}
}
}
</script>
更多推荐
已为社区贡献2条内容
所有评论(0)