美文网首页
[6]vue-router 的重定向-redirect

[6]vue-router 的重定向-redirect

作者: 你喜欢吃青椒吗_c744 | 来源:发表于2019-08-15 09:33 被阅读0次

资料来源于技术胖的个人网站

开发中有时候我们虽然设置的路径不一致,但是我们希望跳转到同一个页面,或者说是打开同一个组件。这时候我们就用到了路由的重新定向redirect参数。重新定位方向。多用于返回页面。

redirect基本重定向

我们只要在路由配置文件中(/src/router/index.js)把原来的component换成redirect参数就可以了。我们来看一个简单的配置。

export default new Router({
  routes: [
    {
      path: '/',
      component: Hello
    },{
      path:'/params/:newsId(\\d+)/:newsTitle',
      component:Params
    },{
      path:'/goback',
      redirect:'/'
    }
 
  ]
})

这里我们设置了goback路由,但是它并没有配置任何component(组件),而是直接redirect到path:’/’下了,这就是一个简单的重新定向。

重定向时传递参数

重定向时如果也需要传递参数怎么办?
其实vue也已经为我们设置好了,我们只需要在ridirect后边的参数里复制重定向路径的path参数就可以了。

{
  path:'/params/:newsId(\\d+)/:newsTitle',
  component:Params
},{
  path:'/goParams/:newsId(\\d+)/:newsTitle',
  redirect:'/params/:newsId(\\d+)/:newsTitle'
}

已经有了一个params路由配置,我们在设置一个goParams的路由重定向,并传递了参数。这时候我们的路由参数就可以传递给params.vue组件了。参数接收方法和正常的路由接收方法一样。

相关文章

  • [6]vue-router 的重定向-redirect

    资料来源于技术胖的个人网站 开发中有时候我们虽然设置的路径不一致,但是我们希望跳转到同一个页面,或者说是打开同一个...

  • Http重定向与转发

    重定向(Redirect) 重定向(Redirect)[https://baike.baidu.com/item/...

  • Vue-router 重定向 - redirect

    在开发中我们设置的路径虽然不一致,但我们希望跳转到同一个页面,或打开同一个组件。这时就用到了 路由重定向 redi...

  • Java 中Redirect和Forward

    Java中连接跳转的2中方式Redirect和Forward (重定向)Redirect 重定向是把request...

  • 开发混淆知识点

    Forward和Redirect的区别 简述: Forward(转发):直接请求 Redirect(重定向):间接...

  • [vue-router4进阶] 2.重定向和别名

    重定向 重定向通过redirect属性来定义,页面会跳到redirect指定的路由比如,我们定义一个根路由‘/’,...

  • struts-default常用的跳转结果类型

    dispatcher 转发,不指定默认为转发 redirect 重定向 redirectAction 重定向...

  • 10.Vue 路由重定向

    在Vue中可以设置路由的重定向,用法如下: 1.redirect: '/path'、redirect: {} 字符...

  • 重定向

    客户端重定向(Redirect)服务器重定向(Dispatch)-- 转发 客户端重定向标准意义的重定向是指HTT...

  • 管理请求处理

    1. url重定向 Response.Redirect 302 Response.RedirectPermanen...

网友评论

      本文标题:[6]vue-router 的重定向-redirect

      本文链接:https://www.haomeiwen.com/subject/zerajctx.html