Vue标准后台界面及登录功能流程（3）

咱们接上一个流程走

一.修改src/App.vue文件

<template>
  <el-container>
    <el-header>
      <img src="http://localhost:8000/public/vue-logo.png" alt="百度logo" class="logo">
      <h1>后台管理</h1>
    </el-header>
    <el-container>
      <Aside />
      <el-container>
        <el-main>
          <router-view />
        </el-main>
        <el-footer>21313131321321111111111111111</el-footer>
      </el-container>
    </el-container>
  </el-container>
</template>

<script>
import Aside from "@/components/layouts/Aside";

export default {
  components: { Aside }
};
</script>

二.修改src/main.js文件

import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import * as filters from "./filters";
import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
import "@/styles/index.scss";

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

// 注册全局过滤器
Object.keys(filters).forEach(key => {
  Vue.filter(key, filters[key]);
});

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

 下面管理后台就搭建成功啦！！