element-ui的安装以及实战from表单的登录页面

element-ui的安装

第一步:命令窗口中在项目地址下:

输入npm i element-ui -S 安装elementui 依赖

第二步:完整引入

在 main.js 中写入以下内容:

import ElementUI from 'element-ui';

import 'element-ui/lib/theme-chalk/index.css';

Vue.use(ElementUI);

第三步:按需引入组件


from表单的登录页面

el-form 组件    :model="ruleForm" ruleForm是data中定义的存储的是用户名和密码值的对象 通过model传给el-form组件 

:rules="rules" rules是data中定义的对象,目的是校验用户名和密码的规则

-- ref="ruleForm" 咱们可以通过ref来获取el-form组件内部的方法 比如:validate校验方法 resetFields重置方法

status-icon 是在表单校验错误的时候 输入框中出现的提示小图标

--label-width="200px" 是用来控制用户名和密码文本的宽度

你可能感兴趣的:(element-ui的安装以及实战from表单的登录页面)