vue编程式导航

vue编程式导航,意思就是用js来跳转页面,项目中用到最多的就是当点击某个按钮时判断当前登录没登录,没有登录点击的时候跳转到登录页面。例子:

<template>

<button @click="getNews()">通过js跳转</button>

</template>

<script>

export default{

data(){

return{

}

},

methods:{

getNews(){

this.$router.push({path:'./login'})//这种是通过path

this.$router.push({path:'./login/1'})//这种是动态路由

this.$router.push({name:'login',params:{id:1}})//这种是命名路由,路由配置时候的name,还可以传参数

}

}

}

</script>

this.$router.go()用来作为 后退/前进导航

  this.$router.go(1);

  this.$router.go(-1);

路由选择(模式)

new VueRouter({

mode:'history'//会有问题,需要后台一起进行配置,默认是哈希模式带“#”的这种

})

猜你喜欢

转载自blog.csdn.net/weixin_42554311/article/details/82857001