vue-tabbar切换

今天说一下vue-tabbar页面切换，样式改变：（当然办法有很多，这只是我的实现方法）

首先，我在views视图文件夹下新建五个vue文件，分别是我要切换的页面，再建一个vue页面，把那五个vue文件合在这里面，我们尽量不要在App.vue里面操作。

这里FirstPage.vue文件，就是我的总页面。

接下来是在router下路由配置，这一步很重要：

import Vue from "vue";
import VueRouter from "vue-router";
// 首页
import Home from "../views/Home.vue";
// 课程
import Course from "../views/Course.vue";
// 展示页
import FirstPage from "../views/FirstPage.vue";
// 我的
import Mine from "../views/Mine.vue";
// 练习
import Practice from "../views/Practice.vue";
// 约课记录
import Record from "../views/Record.vue";


Vue.use(VueRouter);
const routes = [
  {
   
    path: "/",
    name: "FirstPage",
    component:FirstPage,
    children: [
      {
   
        path: "",
        redirect: "home",
      },
      {
   
        pa