第三课 vue路由配置

前提必须先把项目安装并启动起来，然后打开编辑器导入项目，然后开始学习路由。

第一步：安装路由vue-router

cnpm i vue-router --save

第二步：配置路由

如果你下载vue-cli项目的时候，选择了路由，你就不用跳过第二步，但是我假设你并没有选择初始化安装。

1 ) 在项目中的src下建立一个router文件夹，然后在里面再创建一个index.html

2 ) 打开router/index.js

import Vue from 'vue'

import Router from 'vue-router'

import HelloWorld from '@/components/HelloWorld'

Vue.use(Router)

const routes  = [ { path:'/', component: HelloWorld } ]

export default new Router({ routes })

3 ) 打开App.vue,再结构中加入路由显示

4）打开main.js，再newVue注册一个router

import router from './router'

new Vue({ el: '#app', router,

大功告成