Lm-password-box NPM

password-box

作者：zhaojianling
邮箱："zjling1128@gmail.com"
版本：0.2.6

介绍

密码框

安装

lm-* 组件使用 npm 进行管理，命名空间统一为 lm-，请使用以下命令进行组件安装。

npm i lm-password-box --save

如果你还没有安装 npm，可通过以下方式进行安装。
安装cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org

使用

样例文档

待开发

使用

最少配置参数为：

使用自定义键盘

<PasswordBox
    keyboardType={ 'custorm' }
    password={ this.state.password1 }
/>

使用原生键盘

<PasswordBox
    keyboardType={ 'native' }
    password={ this.state.password2 }
    onChange={ this.getInputVal }
/>

需要让input失去焦点时，需要给组件添加ref例如 ref={(dom) => this.passwordboxIns = dom } 然后调用this.passwordboxIns.refs.nativeKeyBoard.onhandleBlur()

配置参数

Prop	Type	Default	Description
keyboardType	string	custorm	键盘类型（native、custorm）
password	string		密码
passwordLen	number	6	密码长度
inputType	string	number	input type(keyboardType 为native时有效)
isEncrypt	bool	true	是否加密
hasAnimation	bool	false	是否有动画
animationDuration	number	300	完成动画所花费的时间，以毫秒计
className	string		类名
onChange	function	() => {}	回调函数（keyboardType为native时用于父组件获取键盘输入值）
onClick	function	() => {}	点击事件
hasError	bool	false	输入是否有错
hasEyeButton	bool	false	是否显示眼睛按钮
eyeButtonClassName	object		眼睛按钮样式设置{openEyeClass: '',closeEyeClass: ''}
eyePos	string	right	眼睛位置(right, bottom)
styleType	string	box	密码框的展示类型(box, underline)
classConfig	object		样式配置{usualClass: '', errorClass: ''}
contentType	string	circle	加密样式(circle， star)