使用Element ui 编写登录页面

1 完整引入element ui 

执行命令安装npm i element-ui -S

mian.js中 完整引入

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

Vue.use(ElementUI);

2 登录页 login.vue

 element ui 中 使用v-loading 的加载效果

  

背景图如下 自取：

产生报错的原因可能如下

1  css预处理使用的是sass，可能没有安装

2  svg图标在vue中的使用，可能没有安装

3  去除空格的工具函数

src\utils\validate.js

export function validUsername(str) {
  const valid_map = ['admin', 'editor']
  return valid_map.indexOf(str.trim()) >= 0
}