| placeholder | string | No | - | Text displayed when there is no input. |
| controller<sup>8+</sup> | [TextAreaController](#textareacontroller8) | No | - | Text area controller. |
## Attributes
In addition to universal attributes, the following attributes are supported.
| Name | Type | Default Value | Description |
| -------- | -------- | -------- | -------- |
| placeholderColor | Color | - | Placeholder text color. |
| placeholderFont | {<br/>size?: number,<br/>weight?:number \|[FontWeight](ts-universal-attributes-text-style.md),<br/>family?: string,<br/>style?: [FontStyle](ts-universal-attributes-text-style.md)<br/>} | - | Placeholder text style.<br/>- **size**: font size. If the value is of the number type, the unit fp is used.<br/>- **weight**: font weight. For the number type, the value ranges from 100 to 900, at an interval of 100. The default value is **400**. A larger value indicates a larger font weight.<br/>- **family**: font family. Use commas (,) to separate multiple fonts, for example, **'Arial, sans-serif'**. The priority of the fonts is the sequence in which they are placed.<br/>- **style**: font style. |
| textAlign | TextAlign | Start | Sets the text horizontal alignment mode. |
| caretColor | Color | - | Sets the color of the cursor in the text box. |
| inputFilter<sup>8+</sup> | {<br/>value: [ResourceStr](../../ui/ts-types.md),<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. |
| placeholderColor | Color | - | Placeholder text color. |
| placeholderFont | {<br/>size?: number,<br/>weight?:number \|[FontWeight](ts-universal-attributes-text-style.md),<br/>family?: string,<br/>style?: [FontStyle](ts-universal-attributes-text-style.md)<br/>} | - | Placeholder text style.<br/>- **size**: font size. If the value is of the number type, the unit fp is used.<br/>- **weight**: font weight. For the number type, the value ranges from 100 to 900, at an interval of 100. The default value is **400**. A larger value indicates a larger font weight.<br/>- **family**: font family. Use commas (,) to separate multiple fonts, for example, **'Arial, sans-serif'**. The priority of the fonts is the sequence in which they are placed.<br/>- **style**: font style. |
| textAlign | TextAlign | Start | Sets the text horizontal alignment mode. |
| caretColor | Color | - | Sets the color of the cursor in the text box. |
| inputFilter<sup>8+</sup> | {<br/>value: [ResourceStr](../../ui/ts-types.md),<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. |
- TextAlign enums
| Name | Description |
| -------- | -------- |
| Start | Aligns the header horizontally. |
| Center | Horizontal center alignment. |
| End | Align the tail horizontally. |
| Name | Description |
| ------ | ------------------------------- |
| Start | Aligns the header horizontally. |
| Center | Horizontal center alignment. |
| End | Align the tail horizontally. |
## Events
| Name | Description |
| -------- | -------- |
| onChange(callback: (value: string) => void) | Triggered when the input changes. |
| onChange(callback: (value: string) => void) | Triggered when the input 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. |
| 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. |
| bindMenu | Array<MenuItem>\|[CustomBuilder](../../ui/ts-types.md)<sup>8+</sup> | - | Menu bound to the component, which is displayed when you click the component. Textual and custom menu items are supported.|
| bindContextMenu<sup>8+</sup> | content: [CustomBuilder](../../ui/ts-types.md)<br>responseType: ResponseType | - | Context menu bound to the component, which is displayed when you long-press or right-click the component. Only custom menu items are supported.|
| bindMenu | Array<MenuItem>\|[CustomBuilder](../../ui/ts-types.md)<sup>8+</sup> | - | Menu bound to the component, which is displayed when you click the component. Textual and custom menu items are supported. |
| bindContextMenu<sup>8+</sup> | content: [CustomBuilder](../../ui/ts-types.md)<br>responseType: ResponseType | - | Context menu bound to the component, which is displayed when you long-press or right-click the component. Only custom menu items are supported. |
- MenuItem
| Name| Type| Description|
| -------- | -------- | -------- |
| value | string | Menu item text.|
| action | () => void | Action triggered when a menu item is clicked.|
> - When you use createAnimator to create an animation object, you must pass the options parameter.
>
>
> - begin indicates the start point of the animation interpolation. If it is not set, the default value 0 is used.
>
>
> - end indicates the end point of the animation interpolation. If it is not set, the default value 1 is used.
## Adding Animation Events and Calling Methods
The animator supports events and methods, which you can use to customize the animation effect. Events include frame, cancel, repeat, and finish. Methods include update, play, pause, cancel, reverse, and finish. For details about the supported events and methods, see [animator supported events and animator supported APIs](../reference/apis/js-apis-basic-features-animator.md).
The animator supports events and methods, which you can use to customize the animation effect. Events include frame, cancel, repeat, and finish. Methods include update, play, pause, cancel, reverse, and finish. For details about the supported events and methods, see [animator supported events and animator supported APIs](../reference/apis/js-apis-animator.md).
