《Vue 入门篇之登录界面制作》

---

Vue 学习笔记

---

template 的使用

template 如下：

<template>
    <div class="login_container">
        // 登录组件  Login.vue
        登录组件
    </div>
</template>

<script>
export default {}
</script>

<style lang="less" scoped>
.login_container {
    background-color: #2b4b6b;
}
</style>

---

路由设置

设置根路径 重定向到登录界面：
router.js

import Vue from 'vue'
import VueRouter from 'vue-router'
// 导入登录 组件
import Login from '../components/Login.vue'

Vue.use(VueRouter)

const routes = [
  { path: '/', redirect: '/login' },
  { path: '/login', component: Login }
]

const router = new VueRouter({
  routes
})

export default router

学习问题

problem1: