码迷,mamicode.com
首页 > 其他好文 > 详细

Vue路由

时间:2019-10-19 09:41:43      阅读:105      评论:0      收藏:0      [点我收藏+]

标签:ash   window   router   登录   outer   模块   构造函数   前端   页面   

源:B站视频


路由

  • 前端路由与后端路由不同

JS

  • hash #
    • onhashchange() hash值发生改变触发;
    • window.location.hash用来访问或改变当前页面的hash值
      • location.hash

Vue

  • 先安装vue-router路由模块

  • <router-view></router-view>
    • 这是 vue-router 提供的元素,专门用来 当作占位符,将来,路由规则,匹配到的组件,就会展示到这里面。因此,将router-view认为是一个 占位符。
  • 链接要以#开头,如果没有#,点击链接将返回一个真实的页面,会报错。
    • <a herf = ‘#/login‘>登录</a>
  • <router-link></router-link>
    • vue-router 提供的元素,管理链接?
    • <router-link to = ‘/login‘>登录</router-link>结果与上例一样
  • new一个路由对象时,可以为 构造函数 传递一个配置对象。
    • 配置对象中的 route 表示[路由匹配规则]
    • 每个路由规则都是一个对象,有两个必须的属性:
      1. path,表示监听, 提供 路由地址;
      2. component, 表示 如果匹配到了该path,则展示component对应的组件,且该属性值必须时组件模板对象,而不是组件名;
  • 在vue实例中,将路由规则对象注册到实例中,监听URL地址变化,再展示对应组件。
    • vue实例中, router: routerobj,

Vue路由

标签:ash   window   router   登录   outer   模块   构造函数   前端   页面   

原文地址:https://www.cnblogs.com/goooood/p/11701668.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!