@zhangning16
2018-03-19T03:18:50.000000Z
字数 1038
阅读 442
组件库文档
输入框组件,通过鼠标或键盘输入内容,是最基础的表单域的包装。
import React, { Component } from 'react';import ReactDOM from 'react-dom';import { Input } from 'ceshi-stone';class App extends Component {render(){return (<div><Input /><Input value={ 123 }/><Input type="password" /><Input disabled={true} placeholder="不可输入" /><Input placeholder="placeholder" /><Input size="small" /><Input size="base" /><Input size="large" /><Input maxLength={5} /><Input addonBefore="http://" addonAfter=".com" /><Input addonBefore="搜索框" addonAfter={<Icon type='search' />} /></div>)}}ReactDOM.render(<App />, document.getElementById('root'));
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| value | String | 无 | input的值 |
| type | String | text | 声明 input 类型,同原生 input 标签的 type 属性,见:MDN(文本输入域请使用Textarea组件)。 |
| addonBefore | String or ReactNode | 无 | 带标签的 input,设置前置标签 |
| addonAfter | String or ReactNode | 无 | 带标签的 input,设置后置标签 |
| disabled | Boolean | false | 是否禁用状态,默认为 false |
| placeholder | String | 无 | 未输入时的提示 |
| size | String | 'base' | 输入框的宽度,可选值 'small', 'base', 'large' |
| name | String | 无 | 表单字段名称 |
| maxLength | String | 无 | 输入框可输入的最大长度 |
| required(待做) | Boolean | false | 是否必填 |
| customMessage(待做) | String | 无 | 验证不通过时的错误提示 |
| testRule(待做) | RegExp | 无 | 字段的验证规则 |
| 方法名称 | 说明 | 参数 |
|---|---|---|
| onInput | 在input的值改变时触发 | 待确认 |