vue路由配置

安装

本地环境安装路由插件vue-router： cnpm install vue-router --save-dev

配置

在src/router/index.js上，没有自己建

import Vue from 'vue'
import Router from 'vue-router'
import Login from "../views/login/Login";
import Home from "../views/home/Home";

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: "/login",
      name: 'Login',
      component: Login
    },
    {
      path: '/home',
      name: "Home",
      component: Home
    }
  ],
  mode: "history"//干掉地址栏里边的#号键
})

main.js:

import Vue from 'vue'
import App from './App.vue'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import router from './router'

Vue.use(ElementUI);
Vue.config.productionTip = false

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

APP.vue:

<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<script>
export default {
  name: 'App',
  components: {
  }
}
</script>

<style>
 body{
   width: 100%;
   background-color: rgb(239,239,239);
 }
  .lizi{
    position: fixed;
    top: 0;
    width: 100%;
  }
</style>

想看更加详细：vue路由配置