Vue router-link使用的坑

####最近上手VUE，整体配置全部使用默认的配置，但是Route-link就是不跳转
这是我src的项目目录

这是router/index.js的代码，虽然和网上搜的其他的代码截图，整体没毛病，声明并导出了Vue-router的实例

	import Vue from 'vue'
	import Router from 'vue-router'
	import Main from '@/components/Main'
	import Attend from '@/components/Attend'
	
	Vue.use(Router)
	export default new Router({
		mode: 'history',
		routes: [
			{
			  path: '/Main',
			  name: 'Main',
			  component: Main   
			},
			{
			  path: '/Attend',
			  name: 'Attend',
			  component: Attend   
			},
			{
				path:'/',
				redirect:"Main"
			}
		]
	})

这是main.js的代码,需要注意的是，import router这里不能修改成其他名字

	import Vue from 'vue'
	import App from './App'
	import router from './router'
	
	Vue.config.productionTip = false;//阻止Vue在正式运行时发出生产提示
	
	/* eslint-disable no-new */
	Vue.component
	new Vue({
	  el: '#app',
	  router,
	  components: { App },
	  template: '<App/>',//在页面引用
	})

到了关键点了测试使用router-link

	<template>
	  <div id="app">
	    <AppHeader back="false" :title="title" />
	    <div class="content">
	      <router-view />
	    </div>
	    <ul>
	        <li><router-link :to="{name:'Main'}">/</router-link></li>
	        <li><router-link :to="{path:'/Attend'}">/foo</router-link></li>
	        <li><router-link to="/">/bar</router-link></li>
	    </ul>
	  </div>
	</template>

找了好久才发现：to后面的用法

我一直出错的地方是在main.js中引入的Main和Attend包括了组件的全路径，当时跟着一个教程做的，然后我再声明path时直接写的是 path：‘/’,我以为会直接找到，后来调试了好久才回过神来不对，需要改成path:’/Main’,即对应的.vue才可以，小问题折腾了好久，记下来