common-input 使用说明

项目运行

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

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

3. npm run test （测试用例）

4. npm run build （生产环境打包）

InputBox 参数

``
data:{
"status": "edit"
,"isActive": false //蓝线是否出现
,"placeHolder": "请输入" //input中的placeholder
,"defaultValue":"1111111" //input中的defaultvalue
,"readonly": false //只读态
,"errorStatus": false //报错
,"errorMsg":"saca99999sc" //报错信息，为空时不显示
,"PromptMsg":"" //报错信息，为空时不显示
,"istips": true //渲染tips
,"hasInput":true //直接控制是否渲染input框
,"showInput": false //当为true时，并且selectDate有值时则不显示input框（hasinput = false）
,"selectDate":[
// {
// "value":0
// ,"name":"查看详情1"

// ,"isActive":false
// ,"isChecked":true
// },{
// "value":1
// ,"name":"查看详情2"
// ,"pname":"细节看撒2"
// ,"isActive":false
// ,"isChecked":true
// } ,{
// "value":2
// ,"name":"查看详情3"
// ,"pname":"细节看撒3"
// ,"isActive":false
// ,"isChecked":true
// } ,{
// "value":3
// ,"name":"查看详情4"
// ,"pname":"细节看撒4"
// ,"isActive":false
// ,"isChecked":true
// }
]//数据
,handlerClick: function(event, dom){
console.log(dom)
}//组件点击事件
,itemClose: function(event, item, index){
self.itemClose(index)
console.log(item)
}//删除按钮回调
,inputChange: function(event, status, value){
console.log(value)
}//input的change事件
,inputClick: function(event, status, value){
console.log(value)
self.inputClick();
}//input的点击事件
,inputBlur: function(event, status, value){
console.log(value)
self.inputBlur();
}//input的blur事件
,dropClick : function(event, status, dom){
console.log(dom)
}
`

common-input 调用方法

1.安装npm组件包

`
npm install @beisen/common-input --save-dev
`

2.引用组件

`
import CommonInput from "@beisen/common-input"
`
3.传入参数

`
data:{
"status": "edit"
,"isActive": false //蓝线是否出现
,"placeHolder": "请输入" //input中的placeholder
,"defaultValue":"1111111" //input中的defaultvalue
,"readonly": false //只读态
,"errorStatus": false //报错
,"errorMsg":"saca99999sc" //报错信息，为空时不显示
,"PromptMsg":"" //报错信息，为空时不显示
,"istips": true
,"hasInput":true
,"showInput": false
,"selectDate":[
// {
// "value":0
// ,"name":"查看详情1"

// ,"isActive":false
// ,"isChecked":true
// },{
// "value":1
// ,"name":"查看详情2"
// ,"pname":"细节看撒2"
// ,"isActive":false
// ,"isChecked":true
// } ,{
// "value":2
// ,"name":"查看详情3"
// ,"pname":"细节看撒3"
// ,"isActive":false
// ,"isChecked":true
// } ,{
// "value":3
// ,"name":"查看详情4"
// ,"pname":"细节看撒4"
// ,"isActive":false
// ,"isChecked":true
// }
]//数据
,handlerClick: function(event, dom){
console.log(dom)
}//组件点击事件
,itemClose: function(event, item, index){
self.itemClose(index)
console.log(item)
}//删除按钮回调
,inputChange: function(event, status, value){
console.log(value)
}//input的change事件
,inputClick: function(event, status, value){
console.log(value)
self.inputClick();
}//input的点击事件
,inputBlur: function(event, status, value){
console.log(value)
self.inputBlur();
}//input的blur事件
,dropClick : function(event, status, dom){
console.log(dom)
}
render () {
return (

)
}
``