@beisen/inputbox
v0.0.19
Published
InputBox
Downloads
5
Maintainers
Readme
InputBox 使用说明
项目运行
cnpm install 或 npm install cnpm使用教程
npm run dev (开发环境打包 port:8080)
npm run test (测试用例)
npm run build (生产环境打包)
InputBox 参数
data:{
"title": "dqwdqwdqw" //标题
,"status": "" //展示态为show,编辑态为其他
,"defaultValue":"" //默认文字
,"isLink": false //展示态是否是链接
,"linkValue": "http://www.baidu.com" //展示态链接地址
,"selfJump": true //链接跳转方式
//一下参数为编辑态参数
,"required":true //必选
,"placeHolder":"大家好" //input中placeholder
,"PromptMsg":"asdasda" //提示信息,为空时不显示
,"errorStatus": false //报错
,"keepActive":false //保持蓝线一直存在
,"errorMsg":"" //报错信息,为空时不显示
,"disabled":false //input的disable状态,没有下划线
,"readonly":false //input的readonly状态
,"keepValue":false //用于带下拉,可以focue以及蓝线等,只是不可以输入值,通过defaultvalue改变
,"closeBtn": true //是否使用close按钮
,"arrowdownBtn": false //是否使用下拉图标
,"helpMsg":"caxsdcdscasdrefcwregvhvk.bxnaw.ebcakwbc/wencwlekn" //帮助信息,当为空时没有帮助信息
,handlerClick:function(event, status, value){console.log(value)}
,handlerFocus:function(event, status, value){console.log(value)}
,handlerChange:function(event, status, value){console.log(value)}
,handlerBlur:function(event, status, value){console.log(value)}
,dropClick: function(event, status, value){console.log(value)}
,editClick: function(status){self.toggle(status);}
,handlerKeyup:function(event, status, value){}
}
InputBox 调用方法
1.安装npm组件包
npm install @beisen/InputBox --save-dev
2.引用组件
import Textbox from "@beisen/InputBox"
3.传入参数
data:{
"title": "dqwdqwdqw" //标题
,"status": "" //展示态为show,编辑态为其他
,"defaultValue":"" //默认文字
,"isLink": false //展示态是否是链接
,"linkValue": "http://www.baidu.com" //展示态链接地址
,"selfJump": true //链接跳转方式
//一下参数为编辑态参数
,"required":true //必选
,"placeHolder":"大家好" //input中placeholder
,"PromptMsg":"asdasda" //提示信息,为空时不显示
,"errorStatus": false //报错
,"keepActive":false //保持蓝线一直存在
,"errorMsg":"" //报错信息,为空时不显示
,"disabled":false //input的disable状态,没有下划线
,"readonly":false //input的readonly状态
,"keepValue":false //用于带下拉,可以focue以及蓝线等,只是不可以输入值,通过defaultvalue改变
,"closeBtn": true //是否使用close按钮
,"arrowdownBtn": false //是否使用下拉图标
,"helpMsg":"caxsdcdscasdrefcwregvhvk.bxnaw.ebcakwbc/wencwlekn" //帮助信息,当为空时没有帮助信息
,handlerClick:function(event, status, value){console.log(value)} //input的onClick事件
,handlerFocus:function(event, status, value){console.log(value)} //input的onFocus事件
,handlerChange:function(event, status, value){console.log(value)} //input的onChange事件
,handlerBlur:function(event, status, value){console.log(value)} //input的onblur事件
,dropClick: function(event, status, value){console.log(value)} //下拉按钮点击事件
,editClick: function(status){self.toggle(status);} //展示态右边的编辑按钮点击事件
,handlerKeyup:function(event, status, value){} //input的onKeyup事件
}
render () {
return (
<Textbox {...this.state.data} />
)
}