All Products
Search
Document Center

Mobile Platform as a Service:input

Last Updated:Jul 27, 2023

This topic describes the input component.

Attribute

Type

Default value

Description

Minimum version

value

String

-

Initial content

-

name

String

-

The component name, which is used to submit the form to obtain data.

-

type

String

text

The input type, which can be text, number, idcard, digit, numberpad, digitpad, and idcardpad.

The numberpad, digitpad, and idcardpad1.13.0 types are supported starting from the 10.1.50 client. You can determine the value by running my.canIUse('input.type.numberpad').

password

Boolean

false

Whether the type is password.

-

placeholder

String

-

The placeholder.

-

placeholder-style

String

-

The specified placeholder style.

1.6.0

placeholder-class

String

-

The specified placeholder style class.

1.6.0

disabled

Boolean

false

Whether to disable the button.

-

maxlength

Number

140

The maximum length.

-

focus

Boolean

false

Obtain the focus.

This feature is not supported.

confirm-type

String

done

Set the text of the button in the lower-right corner of the keyboard. Possible values are done (display “done”), go (display “go”), next (display “next”), search (display “search”), and send (display “send” ). The displayed text varies slightly depending on different platforms. This attribute is valid only when type=text.

1.7.0

confirm-hold

Boolean

false

Whether to keep the keyboard unfolded when the button in the lower-right corner of the keyboard is clicked.

1.7.0

cursor

Number

-

Specify the cursor position when focused.

-

selection-start

Number

-1

The starting position of the focus cursor corresponding to the selected text when the cursor is obtained. This attribute must be used in conjunction with selection-end.

1.7.0

selection-end

Number

-1

The ending position of the focus cursor corresponding to the selected text when the cursor is obtained. This attribute must be used in conjunction with selection-start.

1.7.0

randomNumber

Boolean

false

Whether to arrange the numeric keypad randomly when type is set to number, digit, or idcard.

1.9.0

controlled

Boolean

false

Whether the component is a controlled component. If the value is true, the content of value is fully controlled by setData.

1.8.0

onInput

EventHandle

-

Trigger the input event when a keyboard entry occurs, where event.detail = {value: value}.

-

onConfirm

EventHandle

-

Trigger when the keyboard clicking action is completed, where event.detail = {value: value}.

-

onFocus

EventHandle

-

Trigger when the focus action occurs, where event.detail = {value: value}.

-

onBlur

EventHandle

-

Trigger when the focus is lost, where event.detail = {value: value}.

-

Code sample

<input maxlength="10" placeholder="The maximum entry length is 10" />
<input onInput="bindKeyInput" placeholder="The input value will be synced to View"/>
<input type="number" placeholder="This is a numeric entry box" />
<input password type="text" placeholder="This is a password entry box" />
<input type="digit" placeholder="Numeric keypad with decimal point"/>
<input type="idcard" placeholder="The ID number entry keypad" />
Page({
  data: {
    inputValue: '',
  },
  bindKeyInput(e) {
    this.setData({
      inputValue: e.detail.value,
    });
  },
});

Handle interaction exceptions between the iOS keyboard and components

For components that need to start the keyboard, such as input and textarea, the native keyboard is currently used by default. When an interaction exception occurs between the keyboard and a component, you can add the enableNative="{{false}}" attribute to the component to restore to the keyboard that uses WKWebview, as shown in the following code. Meanwhile, since the system keyboard is used, the numeric keypad provided by mPaaS cannot be used. Currently, no special adaptation is available for keyboard-related exceptions. To handle such interaction exceptions, use this method.

<input placeholder="The ID number entry keypad" enableNative="{{false}}" />