VUE-零散记录点之路由的最初级使用方式

180 阅读1分钟
    // router.js
    //第一步引入一些依赖  vue 路由库
import Vue from 'vue'
import Router from 'vue-router'
import banner from '../components/banner'

//第一步让vue使用路由库
Vue.use(Router)

//第三步定义一些路由内容
export default new Router({
    routes:[
        {path:'/banner',component:banner}
    ]
})

//main.js 中注入
import router from './router/router'
Vue.config.productionTip = false

new Vue({
  router,
  render: h => h(App),
}).$mount('#app')


//然后页面即可直接使用
<template>
  <div id="app">
    //第四步 安排路由视图
    <router-link to="/banner">Go to banner</router-link>
    <router-view></router-view>
  </div>
</template>