48-Vue路由基本使用

这里多义概念理解,安装,使用的方法

效果图.gif

https://router.vuejs.org/zh/installation.html

一.多义概念理解

• 路由
  前端:通过哈希切换单应用程序界面(组件)
  后端:通过路由找到url对应的控制器
• 哈希
  前端:URL#后面的内容http不会将哈希传送到服务端
  程序设计语言:一种无序数据存储方式,又叫哈希表,字典
  -单应用程序
  https://m.jd.com/
  https://h5.m.taobao.com/
  所有切换都在当前页面跳转,不会跳转到新的页面
• Vue中的组件路由在浏览器编译后的代码都会转换为html中的标签,不会有Vue中自定义的标签,这需要浏览器有解析Vue的功能,我们之前在google中安装过

二.下载Route

和vuex一样,新建js文件到粘贴

三.使用Route

• 导入文件Vue下方
• 定义路由组件
• 定义路由
• 创建路由对象
• 注册路由对象
• 设置哈希跳转

• 设置路由出口

  
  image.png
  image.png
  

  这里router-link会被Vue编译器编译成a标签