textarea

多行输入框。

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

WARNING

  • 请勿在 scroll-view、swiper、picker-view 中使用 textarea 组件
  • css 动画对 textarea 组件无效

示例

  1. <textarea
  2.     bindfocus="onTextFocus"
  3.     bindblur="onTextBlur"
  4.     bindinput="onTextInput"
  5.     bindconfirm="onTextConfirm"
  6.     placeholder="请输入"
  7. />
  9. <text>用户输入：{{value}}</text>
  1. Page({
  2.   data: {
  3.     value: ''
  4.   },
  5.   onTextFocus: function (e) {
  6.     console.log(e)
  7.   },
  8.   onTextBlur: function (e) {
  9.     console.log(e)
  10.   },
  11.   onTextInput: function (e) {
  12.     this.setData({
  13.       value: e.detail.value
  14.     })
  15.   },
  16.   onTextConfirm: function (e) {
  17.     tt.showToast({title: 'confirm'})
  18.   }
  19. })

原文: https://developer.toutiao.com/docs/comp/textarea.html