vue路径组件的使用

import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from "@/views/Home";
import Goods from "@/views/Goods";
Vue.use(VueRouter)

const routes = [
  {
    path:'/',  // 路由关系
    name:'home',  // 起个别名
    component:Home  // 视图函数
  },
    {
    path:'/goods',
    name:'goods',
    component:Goods
  },
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router

在main.js中导入

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

Vue.config.productionTip = false

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

只要使用了路由组件，this中就会多$router，VueRouter实例 和 $toute