textarea
2020-02-11 18:45 更新
基础库 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
更多建议: