vue-router配置介绍和使用方法（一）

---

---

1. vue-router配置流程概述：

1) 准备工作：

• 建立vue.js项目文件夹，通过cmd命令，完成新建文件夹的相关项目配置（具体操作，请参考“如何进行 node.js的 安装与卸载 ”）；
• vue init webpack 项目文件名
• 接着按要求配置Project name、author、vue-router（选择Yes）等等相关参数
• cd 项目文件名
• npm install
• npm run dev

2) 在main.js文件中，进行关于（首页）主体文件（App.vue）的基础配置：

• 引入Vue主体

• 引入vue-router主体

• 引入一个个link路由对象：

  • 在main.js文件中，创建路由对象并配置路由规则（如下绿色加粗代码）：

    	let router = new VueRouter({
           
           
    			//routes
    			routes: [
    			//component后面是一个个link对象
    				    {
           
           path: '/home',name: 'app',component: Home},
    				    {
           
           path: '/hello',name: 'app',component: HelloWorld}
    		  ]
    	})