| content | string | No | '' | Text content, which is the content of the child component **<Span>**. This parameter does not take effect when the child component **<Span>** is contained. |
| content | string | No | '' | Text content, which is the content of the child component **<Span>**. This parameter does not take effect when the child component **<Span>** is contained. |
## Attributes
## Attributes
...
@@ -41,33 +41,33 @@ Text(content?: string)
...
@@ -41,33 +41,33 @@ Text(content?: string)
| textCase | TextCase | TextCase.Normal | Text case. |
| textCase | TextCase | TextCase.Normal | Text case. |
- TextAlign enums
- TextAlign enums
| Name | Description |
| Name | Description |
| -------- | -------- |
| -------- | -------- |
| Center | The text is center-aligned. |
| Center | The text is center-aligned. |
| Start | The text is aligned with the direction in which the text is written. |
| Start | The text is aligned with the direction in which the text is written. |
| End | The text is aligned with the opposite direction in which the text is written. |
| End | The text is aligned with the opposite direction in which the text is written. |
- TextOverflow enums
- TextOverflow enums
| Name | Description |
| Name | Description |
| -------- | -------- |
| -------- | -------- |
| Clip | Extra text is truncated. |
| Clip | Extra text is truncated. |
| Ellipsis | The ellipsis (...) is used for extra-long text. |
| Ellipsis | The ellipsis (...) is used for extra-long text. |
| None | No truncation or ellipsis is used for extra-long text. |
| None | No truncation or ellipsis is used for extra-long text. |
- TextDecorationType enums
- TextDecorationType enums
| Name | Description |
| Name | Description |
| -------- | -------- |
| -------- | -------- |
| Underline | An underline is used. |
| Underline | An underline is used. |
| LineThrough | A strikethrough is used. |
| LineThrough | A strikethrough is used. |
| Overline | An overline is used. |
| Overline | An overline is used. |
| None | No decorative line is used. |
| None | No decorative line is used. |
- TextCase enums
- TextCase enums
| Name | Description |
| Name | Description |
| -------- | -------- |
| -------- | -------- |
| Normal | The original case of the text is retained. |
| Normal | The original case of the text is retained. |
| LowerCase | All letters in the text are in lowercase. |
| LowerCase | All letters in the text are in lowercase. |
| UpperCase | All letters in the text are in uppercase. |
| UpperCase | All letters in the text are in uppercase. |
> The **<Text>** component cannot contain both the text and the child component **<Span>**. If both of them exist, only the content in **<Span>** is displayed.
> The **<Text>** component cannot contain both the text and the child component **<Span>**. If both of them exist, only the content in **<Span>** is displayed.
| placeholder | string | No | - | Text displayed when there is no input. |
| placeholder | string | No | - | Text displayed when there is no input. |
| controller<sup>8+</sup> | [TextInputController](#textinputcontroller8) | No | - | Text input controller. |
| controller<sup>8+</sup> | [TextInputController](#textinputcontroller8) | No | - | Text input controller. |
## Attributes
## Attributes
...
@@ -41,33 +41,33 @@ In addition to [universal attributes](ts-universal-attributes.md), the following
...
@@ -41,33 +41,33 @@ In addition to [universal attributes](ts-universal-attributes.md), the following
| enterKeyType | EnterKeyType | EnterKeyType.Done | How the Enter key is labeled. |
| enterKeyType | EnterKeyType | EnterKeyType.Done | How the Enter key is labeled. |
| caretColor | Color | - | Color of the caret (also known as the text insertion cursor). |
| caretColor | Color | - | Color of the caret (also known as the text insertion cursor). |
| maxLength<sup>8+</sup> | number | - | Maximum number of characters in the text input. |
| maxLength<sup>8+</sup> | number | - | Maximum number of characters in the text input. |
| inputFilter<sup>8+</sup> | {<br/>value: [ResourceStr](../../ui/ts-types.md#resourcestr8),<br/>error?: (value: string)<br/>} | - | Regular expression for input filtering. Only inputs that comply with the regular expression can be displayed. Other inputs are ignored. The specified regular expression can match single characters, but not strings. Example: ^(? =.\*\d)(? =.\*[a-z])(? =.\*[A-Z]).{8,10}$. Strong passwords containing 8 to 10 characters cannot be filtered.<br/>- **value**: indicates the regular expression to set.<br/>- **error**: returns the ignored content when regular expression matching fails. |
| inputFilter<sup>8+</sup> | {<br/>value: [ResourceStr](../../ui/ts-types.md)<sup>8+</sup>,<br/>error?: (value: string)<br/>} | - | Regular expression for input filtering. Only inputs that comply with the regular expression can be displayed. Other inputs are ignored. The specified regular expression can match single characters, but not strings. Example: ^(? =.\*\d)(? =.\*[a-z])(? =.\*[A-Z]).{8,10}$. Strong passwords containing 8 to 10 characters cannot be filtered.<br/>- **value**: indicates the regular expression to set.<br/>- **error**: returns the ignored content when regular expression matching fails. |
- EnterKeyType enums
- EnterKeyType enums
| Name | Description |
| Name | Description |
| -------- | -------- |
| -------- | -------- |
| EnterKeyType.Go | The Enter key is labeled "Go." |
| EnterKeyType.Go | The Enter key is labeled "Go." |
| EnterKeyType.Search | The Enter key is labeled "Search." |
| EnterKeyType.Search | The Enter key is labeled "Search." |
| EnterKeyType.Send | The Enter key is labeled "Send." |
| EnterKeyType.Send | The Enter key is labeled "Send." |
| EnterKeyType.Next | The Enter key is labeled "Next." |
| EnterKeyType.Next | The Enter key is labeled "Next." |
| EnterKeyType.Done | The Enter key is labeled "Done." |
| EnterKeyType.Done | The Enter key is labeled "Done." |
- InputType enums
- InputType enums
| Name | Description |
| Name | Description |
| -------- | -------- |
| -------- | -------- |
| InputType.Normal | Normal input mode. |
| InputType.Normal | Normal input mode. |
| InputType.Password | Password input mode. |
| InputType.Password | Password input mode. |
| InputType.Email | Email address input mode. |
| InputType.Email | Email address input mode. |
| InputType.Number | Digit input mode. |
| InputType.Number | Digit input mode. |
### TextInputController<sup>8+</sup>
### TextInputController<sup>8+</sup>
Implements the controller of the **<TextInput>** component.
Implements the controller of the **<TextInput>** component.
| Name | Description |
| Name | Description |
| -------- | -------- |
| -------- | -------- |
| caretPosition(value: number):void | Position of the input cursor.<br/>**value**: indicates the length from the start of the string to the position where the input cursor is located. |
| caretPosition(value: number):void | Position of the input cursor.<br/>**value**: indicates the length from the start of the string to the position where the input cursor is located. |
| value | number | Yes | - | Position of the input cursor.<br/>**value**: indicates the length from the start of the string to the position where the input cursor is located. |
| value | number | Yes | - | Position of the input cursor.<br/>**value**: indicates the length from the start of the string to the position where the input cursor is located. |
## Events
## Events
| Name | Description |
| Name | Description |
| -------- | -------- |
| -------- | -------- |
| onChange(value: string) => void | Triggered when the input changes. |
| onChange(value: string) => void | Triggered when the input changes. |
| onSubmit(callback: (enterKey: EnterKeyType) => void) | Triggered when the Enter key on the physical or soft keyboard is pressed. |
| onSubmit(callback: (enterKey: EnterKeyType) => void) | Triggered when the Enter key on the physical or soft keyboard is pressed. |
| onEditChanged(callback: (isEditing: boolean) => void) | Triggered when the input status changes. |
| onEditChanged(callback: (isEditing: boolean) => void) | Triggered when the input status changes. |
| onCopy<sup>8+</sup>(callback:(value: string) => void) | Triggered when the copy button on the pasteboard, which displays when the text box is long pressed, is clicked.<br/>**value**: text to be copied. |
| onCopy<sup>8+</sup>(callback:(value: string) => void) | Triggered when the copy button on the pasteboard, which displays when the text box is long pressed, is clicked.<br/>**value**: text to be copied. |
| onCut<sup>8+</sup>(callback:(value: string) => void) | Triggered when the cut button on the pasteboard, which displays when the text box is long pressed, is clicked.<br/>**value**: text to be cut. |
| onCut<sup>8+</sup>(callback:(value: string) => void) | Triggered when the cut button on the pasteboard, which displays when the text box is long pressed, is clicked.<br/>**value**: text to be cut. |
| onPaste<sup>8+</sup>(callback:(value: string) => void) | Triggered when the paste button on the pasteboard, which displays when the text box is long pressed, is clicked.<br/>**value**: text to be pasted. |
| onPaste<sup>8+</sup>(callback:(value: string) => void) | Triggered when the paste button on the pasteboard, which displays when the text box is long pressed, is clicked.<br/>**value**: text to be pasted. |
| space | number | No | 0 | Spacing between list items. |
| space | number | No | 0 | Spacing between list items. |
| initialIndex | number | No | 0 | Item displayed at the beginning of the component when the current list is loaded for the first time, that is, the first item to be displayed. If the configured sequence number is greater than the sequence number of the last item, the setting does not take effect. |
| initialIndex | number | No | 0 | Item displayed at the beginning of the component when the current list is loaded for the first time, that is, the first item to be displayed. If the configured sequence number is greater than the sequence number of the last item, the setting does not take effect. |
| restoreId<sup>8+</sup> | number | - | Migration ID of the component. During application migration, the status of the component is migrated to the component with the same migration ID on the peer end.<br/>For a **<List>** component, the status includes the item serial number displayed at the start position. |
| restoreId<sup>8+</sup> | number | - | Migration ID of the component. During application migration, the status of the component is migrated to the component with the same migration ID on the peer end.<br/>For a **<List>** component, the status includes the item serial number displayed at the start position. |
- EdgeEffect enums
- EdgeEffect enums
| Name | Description |
| Name | Description |
| -------- | -------- |
| -------- | -------- |
| Spring | Similar to the physical dynamic effect of a spring. After scrolling to the edge, you can continue to scroll for a distance based on the initial speed or by touching the knob of the scrollbar. After you release your hand, the knob is rebounded. |
| Spring | Similar to the physical dynamic effect of a spring. After scrolling to the edge, you can continue to scroll for a distance based on the initial speed or by touching the knob of the scrollbar. After you release your hand, the knob is rebounded. |
| None | No effect after the scroll bar is moved to the edge. |
| None | No effect after the scroll bar is moved to the edge. |
## Events
## Events
| Name | Description |
| Name | Description |
| -------- | -------- |
| -------- | -------- |
| onItemDelete(index: number) => boolean | Triggered when a list item is deleted. |
| onItemDelete(index: number) => boolean | Triggered when a list item is deleted. |
| onScrollIndex(firstIndex: number, lastIndex: number) => void | Triggered when the start position and end position of the current list are changed. |
| onScrollIndex(firstIndex: number, lastIndex: number) => void | Triggered when the start position and end position of the current list are changed. |
