[关闭]
@zhangning16 2018-03-19T03:18:50.000000Z 字数 1038 阅读 385

组件库文档

Input 输入框

输入框组件,通过鼠标或键盘输入内容,是最基础的表单域的包装。

How to use?

  1. import React, { Component } from 'react';
  2. import ReactDOM from 'react-dom';
  3. import { Input } from 'ceshi-stone';
  4. class App extends Component {
  5. render(){
  6. return (
  7. <div>
  8. <Input />
  9. <Input value={ 123 }/>
  10. <Input type="password" />
  11. <Input disabled={true} placeholder="不可输入" />
  12. <Input placeholder="placeholder" />
  13. <Input size="small" />
  14. <Input size="base" />
  15. <Input size="large" />
  16. <Input maxLength={5} />
  17. <Input addonBefore="http://" addonAfter=".com" />
  18. <Input addonBefore="搜索框" addonAfter={<Icon type='search' />} />
  19. </div>
  20. )
  21. }
  22. }
  23. ReactDOM.render(<App />, document.getElementById('root'));

Options

属性名 类型 默认值 说明
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 字段的验证规则

Events

方法名称 说明 参数
onInput 在input的值改变时触发 待确认
添加新批注
在作者公开此批注前,只有你和作者可见。
回复批注