VUE(二)・共通コンポーネント

5285 ワード

Header.vue




  export default {
    data() {
      return {
        theme1: 'light'
      }
    }
  }




 
Lateral.vue



  export default {
    data() {
      return {
        theme2: 'light'
      }
    }
  }




 
Footer.vue



  export default {
    name: "Footer"
  }




 
 
APP.vue



  import Header from './components/Header'
  import Lateral from './components/Lateral'
  import Footer from './components/Footer'

  export default {
    name: 'App',

    components: {
      Header,
      Lateral,
      Footer,
    },
    data() {
      return {}
    },

  }




 
index.js
import Vue from 'vue'
import Router from 'vue-router'
import Login from '@/components/Login'
import Home from '@/components/Home'
import Test from '@/components/Test'

Vue.use(Router)

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'login',
      component: Login,
      meta: {
        keepAlive: false
      }
    },

    {
      path: '/home',
      name: 'home',
      component: Home,
      meta: {
        requireAuth: true,
        keepAlive: true
      }
    },

    {
      path: '/test',
      name: 'test',
      component: Test,
      meta: {
        requireAuth: true,
        keepAlive: false
      }
    },


  ]
})