阅读(4750)
赞(12)
textarea
2020-02-11 17:55:01 更新
基础库 1.0.0 开始支持本组件。
多行文本输入框。
| 属性名 | 类型 | 默认值 | 说明 | 最低版本 |
|---|---|---|---|---|
| value | String | 输入框的内容 | 1.0.0 | |
| placeholder | String | 输入框为空时占位符 | 1.0.0 | |
| placeholder-style | String | 指定 placeholder 的样式 | 1.0.0 | |
| disabled | Boolean | false | 是否禁用 | 1.0.0 |
| maxlength | Number | 140 | 最大输入长度，设置为 -1 的时候不限制最大长度 | 1.0.0 |
| focus | Boolean | false | 是否获得焦点 | 1.0.0 |
| auto-height | Boolean | false | 是否自动增高，设置 auto-height 时，设置 height 样式不生效 | 1.0.0 |
| fixed | Boolean | false | 是否固定位置，如果设置了 css 样式position:fixed，需要将改属性设置为 true | 1.0.0 |
| cursor-spacing | Number | 0 | 指定软键盘弹出时，与光标的距离是多少，单位是 px | 1.0.0 |
| cursor | Number | -1 | 指定 focus 时的光标位置 | 1.0.0 |
| selection-start | Number | -1 | 指定 focus 时选中片段的起始位置 | 1.0.0 |
| selection-end | Number | -1 | 指定 focus 时选中片段的结束位置 | 1.0.0 |
| bindinput | EventHandler | 键盘输入时触发，e.detail={value, cursor} | 1.0.0 | |
| bindfocus | EventHandler | 输入框聚焦时触发，event.detail={value,height}，height 是软键盘的高度 | 1.0.0 | |
| bindblur | EventHandler | 输入框失去焦点时触发，event.detail={value} | 1.0.0 | |
| bindconfirm | EventHandler | 用户点击键盘的完成按钮时触发，event.detail={value} | 1.0.0 |
示例
<textarea
bindfocus="onTextFocus"
bindblur="onTextBlur"
bindinput="onTextInput"
bindconfirm="onTextConfirm"
placeholder="请输入"
/>
<text>用户输入：{{value}}</text>Page({
data: {
value: ""
},
onTextFocus: function(e) {
console.log(e);
},
onTextBlur: function(e) {
console.log(e);
},
onTextInput: function(e) {
this.setData({
value: e.detail.value
});
},
onTextConfirm: function(e) {
tt.showToast({ title: "confirm" });
}
});Bug & Tip
- 请勿在 scroll-view、swiper、picker-view 中使用 textarea 组件。
- css 动画对 textarea 组件无效。
- 如果样式上设置为 fixed 元素，请在组件上添加 fixed 属性。
← switch