InputBox 使用说明

项目运行

1. cnpm install 或 npm install cnpm使用教程

2. npm run dev （开发环境打包 port:8080）

3. npm run test （测试用例）

4. 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} />
    )
  }