美文网首页
vue.router跳转补充

vue.router跳转补充

作者: 梁萌0328 | 来源:发表于2018-09-27 20:10 被阅读0次

一、

    const routes = [
     {path: ' / ' ,component : Home},
    {path: ' /menu ' ,component : Menu},
    {path: ' /about ' ,component : About},

    //如果没有找到以上菜单(输入错误),跳转到主页面

    {path: ' * ' , redirect :  ' /Home '}
  ]

二、

     <router-link to = ' / '></router-link>//表示跳转 a标签
      <router-link to = ' / '  tag = ' div '></router-link>//把a标签换成div标签

三、

  <router-link  :to = ' homeLink '></router-link>//可以绑定属性值
  data (){
        return (){
                homeLink : ' / '
        }
  }

四、可以给每一个属性增加name属性进行跳转

  <router-link  :to = ' { name: ' nameLink ' } '></router-link>
  <router-link  :to = ' { name: ' aboutLink ' } '></router-link>
  <router-link  :to = ' { name: ' loginLink ' } '></router-link>

配置路由:

   const routes = [
       {path: ' / ' , name : ' nameLink ' , component : Home},
       {path: ' /menu ' , name : ' aboutLink ' , component : Menu},
       {path: ' /about ' ,  name : ' loginLink ' , component : About}
  ]

相关文章

  • vue.router跳转补充

    一、 二、 三、 四、可以给每一个属性增加name属性进行跳转 配置路由:

  • vue.router

    一.安装vue-router vue-router是一个插件包,所以我们还是需要用npm来进行安装的。打开命令行工...

  • iOS URL Schemes 系统App清单

    苹果系统自带App跳转URL Schemes ,欢迎大家补充 1.AMSEngagementViewService...

  • Activity

    目录 生命周期 任务栈/启动模式 onSaveInstanceState() scheme跳转协议 补充结论 1....

  • IOS 页面跳转方法总结

    尝试列出所有的页面跳转方法,有疏漏的欢迎补充。 1.UINavigationController - push &...

  • 微信小程序页面跳转方法总结

    微信小程序页面跳转目前有以下方法(不全面的欢迎补充): 1. 利用小程序提供的 API 跳转: // 保留当前页面...

  • 跳转大全

    微信小程序页面跳转目前有以下方法(不全面的欢迎补充): 1. 利用小程序提供的 API 跳转: //保留当前页面,...

  • (3)vue.router

    router 子路由(路由)修改 新建路由 components文件夹下新建.vue文件,里面为新组件的内容。 i...

  • iOS 页面跳转方法总结

    尝试列车所以得页面跳转方法 ,有疏漏的欢迎补充。1.UINavigationController - push p...

  • iOS跳转到qq聊天界面

    补充 :因iOS10之后,上面的跳转到qq客户端的,方式已经不能实现(不灵了 不能正常跳转)以下方式是可以在iOS...

网友评论

      本文标题:vue.router跳转补充

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