textarea

2020-02-11 18:45 更新
基础库 1.0.0 开始支持本组件。

多行文本输入框。

属性名类型默认值说明最低版本
valueString输入框的内容1.0.0
placeholderString输入框为空时占位符1.0.0
placeholder-styleString指定 placeholder 的样式1.0.0
disabledBooleanfalse是否禁用1.0.0
maxlengthNumber140最大输入长度,设置为 -1 的时候不限制最大长度1.0.0
focusBooleanfalse是否获得焦点1.0.0
auto-heightBooleanfalse是否自动增高,设置 auto-height 时,设置 height 样式不生效1.0.0
fixedBooleanfalse是否固定位置,如果设置了 css 样式position:fixed,需要将改属性设置为 true1.0.0
cursor-spacingNumber0指定软键盘弹出时,与光标的距离是多少,单位是 px1.0.0
cursorNumber-1指定 focus 时的光标位置1.0.0
selection-startNumber-1指定 focus 时选中片段的起始位置1.0.0
selection-endNumber-1指定 focus 时选中片段的结束位置1.0.0
bindinputEventHandler键盘输入时触发,e.detail={value, cursor}1.0.0
bindfocusEventHandler输入框聚焦时触发,event.detail={value,height},height 是软键盘的高度1.0.0
bindblurEventHandler输入框失去焦点时触发,event.detail={value}1.0.0
bindconfirmEventHandler用户点击键盘的完成按钮时触发,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 属性。
以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号