去到新的页面</button> <button @click="go">前进</button> <button @c" />

vue中动态路由的跳转(name | path)&& 前进后退 && replace

<button @click="tiaozhuan">去到新的页面</button>
<button @click="go">前进</button>
<button @click="back">后退</button>

 methods: {
        tiaozhuan(){
        // this.$router.push({name:'me'})  //组件name跳转
        // this.$router.push({path:'/me/text'}) //组件path跳转

        // this.$router.push({name:'weather',params:{city:'北京'}})  
        //组件name跳转 带参数 如果使用name路由并且需要传递参数,需要搭配params一起

        // this.$router.push({path:'/weather/天津',params:{city:'北京'}})  
        //天津  两种参数都存在的时候,path中的参数会起作用

        // this.$router.push({path:'/weather/北京?username=jia&password=123456'})  //传值
        this.$router.push({path:'/weather/牡丹江',query:{username:'jiajia',password:123456}})
        //传值 分开写会自动拼接到path中
        
        // this.$router.replace({path:'/weather/牡丹江',query:{username:'jiajia',password:123456}},()=>{
        //     console.log('成功替换了页面,replace有回调函数')
        // })  //去到了path页面后,不能回退到上一个页面,回退的只能是浏览器标签页
        // console.log(this)
         },
         go(){
            this.$router.go(1)//前进 数字可根据情况定义 history不够的话,是失败的
        },
        back(){
            this.$router.go(-1)//后退
        }
    },
vue中动态路由的跳转(name | path)&& 前进后退 && replace
 收藏 (0) 打赏

您可以选择一种方式赞助本站

支付宝扫一扫赞助

微信钱包扫描赞助

未经允许不得转载:青梅博客 » vue中动态路由的跳转(name | path)&& 前进后退 && replace

分享到: 更多 (0)
avatar

评论 抢沙发

  • QQ号
  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
切换注册

登录

忘记密码 ?

切换登录

注册

我们将发送一封验证邮件至你的邮箱, 请正确填写以完成账号注册和激活