VUE 路由及组件使用

一、组件

在src里面components文件夹下面新建一个你需要的组件，例如navs这样一个组件。在navs.vue里面写你的结构样式等内容封装一个导航的模块；

然后在需要你入的文件里面引入，例如app.vue下面

<script>
import navs from './components/navs/navs';
export default {
  name: 'app',
  components:{
    navs
  }
}
</script>
这样定义完后，看你哪个版块需要就在那个版块写一下<navs></navs>就可以成功的引入你的新定义的组件了

二、路由
在src里面有一个router的文件夹，里面有个index.js文件，接下来把你需要链接跳转的版块在index.js里面引入；
import score from'@/components/competition/score'
export default new Router({
  routes: [
    {
      path: '/score',
      name: '',
      component: score
    }
  ]
})
html 导航里面你就可以直接用

<router-link
to="/score">列表</router-link>