Erwan-ui NPM | npm.io

erwan-ui组件库

组件1 - 异常提示图

根据 type 属性定义不同类型的输入框，有 'nothing', 'zeroStock', 'networkBreak', 'noRecord', 'submitted'，'noPass', 默认 'nothing'

<!-- nothing 什么都没有 -->
<Blank type="nothing"/>

<!-- zeroStock 暂无添加任何股票 -->
<Blank type="zeroStock"/>

<!-- networkBreak 断网了 -->
<Blank type="networkBreak"/>

<!-- noRecord 无记录 -->
<Blank type="noRecord"/>

<!-- submitted 您的开户申请资料已提交 -->
<Blank type="submitted"/>

<!-- noPass 开户审核不通过 -->
<Blank type="noPass"/>

组件2 - 按钮

type 属性定义类型，有 'default', 'primary', 默认 'default'

size 属性定义尺寸，有 'small', 'medium', 'large-dialog', 'large'，默认 'small'

bgColor 属性定义背景颜色，有 'white', 'blue', 'gray'，默认 'white'

borderColor 属性定义边框颜色，有 'default', 'blue', 'yellow'，默认 'default'

icon 属性定义文字前的icon, 有 'none', 'add'，默认 'none'

<!-- 大尺寸，空心 -->
<Button type="default" size="large">取消</Button>
<!-- 中尺寸，蓝色背景色，添加icon -->
<Button type="primary" bgColor="blue" size="medium" icon="add">添加股票</Button>
<!-- 小尺寸，蓝色背景色 -->
<Button type="primary" size="small" bgColor="blue">blue</Button>

组件3 - 勾选

根据 type 属性定义不同类型的勾选图标，有 'no', 'checked', 'mark'，默认 'no'

<!-- 未勾选 -->
<CheckedItem type="no"><span>我有邀请码</span></CheckedItem>
<!-- 已勾选 -->
<CheckedItem type="checked"><span>我有邀请码</span></CheckedItem>
<!-- 弱勾选 -->
<CheckedItem type="mark"><span>登录或注册即同意"用户协议"</span></CheckedItem>

组件4 - 输入框

inputType 属性定义不同类型的输入框，有 'text', 'tel', 'number', 'digit', 'password'，默认 'text'

inputTitle 属性定义输入框前面的提示框，默认为空

placeText 属性定义输入框的输入提示，默认为空

updateEInputVal 属性定义回调取值方法

<!-- 输入任意文本 -->
<EInput inputType="text" inputTitle="公司名称" placeText="请输入您的公司名称" @updateEInputVal="updateEInputVal"/>
<!-- 输入手机号，调起手机号键盘 -->
<EInput inputType="tel" inputTitle="手机事情" placeText="请输入您的手机号" @updateEInputVal="updateEInputVal"/>
<!-- 允许输入正整数，调起纯数字键盘 -->
<EInput inputType="digit" inputTitle="序号" placeText="请输入序号" @updateEInputVal="updateEInputVal"/>
<!-- 允许输入数字，调起带符号的纯数字键盘 -->
<EInput inputType="number" inputTitle="金额" placeText="请输入金额" @updateEInputVal="updateEInputVal"/>
<!-- 输入密码 -->
<EInput inputType="password" inputTitle="密码" placeText="请输入您的密码" @updateEInputVal="updateEInputVal"/>