vue路由(router)

在创建vue项目时,路由、组件这些是必不可少的,它们是基本功,运用好了才能体现vue框架的便利。在这里我用一个切换选项卡的例子来具体说明vue路由的运用。

用vue脚手架创建项目

vue脚手架创建的项目会有两个示例的路由,我们只需要参照示例就可以创建自己的路由:

  • 现在view目录下创建页面组件:
    vue路由(router)
  • 在router.js中配置路由规则
    vue路由(router)
    在此例子中user页面采用的是组件懒加载,path代表访问网址是显示在地址栏的路径,component配置的是组件路径。
  • 由此,在搭建项目时先要规划整个项目的框架结构,也就是页面组件、公众组件,一般公众组件是放在component目录下。