BaseInput

• category: Components
• chinese: 基础输入框
• type: 基本

API

Props

| Props | Description | type | default | Accepted Values | | ---------------- | ------------------ | -------------------- | --------- | --------------- | | multiple | 多行 | boolean | false || | type | 输入类型 | String| text |text date tel number| | disabled | 是否禁用 | boolean | false || | readOnly | 是否只读 | Boolean | false || | maxLength | 最大长度，只有 type = text 才生效 | number| - || | onInput | 输入事件 | function(value, e) | false || | onFocus | Focus 事件 | function | false || | onBlur | Blur 事件 | function | false || | onChange | change | function(value, e) | || | onReturn | 点击虚拟键盘右下角的键触发的事件，在 native 端使用原生事件，web 端使用 keyup 且 charCode = 13 代替。返回值 e {returnKeyType:'类型',value:'输入框的值'} | function(e) | false || | returnKeyType | 虚拟键盘右下角的文案，目前只在 native 有效 | string| default | default go next search send done| | rows | multiple = true 时，可同时显示的行数 | number| 2 || | placeholder | placeholder 文本| string| - || | placeholderColor | placeholder 颜色，仅 native 有效 | string| '#999999' ||

实例方法

• focus()

  让 input 获得焦点

• blur() 让 input 失去焦点

• getValue() 获取输入框的值

• setNativeFormatRule(rules) [weex 0.17+] 设置 native 中对实时输入内容格式化的规则，这个方法常用于前端无法解决的 native 双向绑定的场景。

  以下 demo 给出在客户端上信用卡卡号输入时，每输入 4 个数字自动加入一个空格的场景：

  const rules={
    formatRule: '/(\\d{4})(?!$)/g',
    formatReplace: '$1 ',
    recoverRule: '/(\\s*)/g',
    recoverReplace: '',
  }
  componentDidMount() {
    if (isWeb) {
      //...
    } else {
      setTimeout(() => {
        this.refs['text-field'] && this.refs['text-field'].setNativeFormatRule(rules);
      }, 500);
    }
  }