字节跳动小程序开发组件文档 textarea

由 卓别林 创建, 最后一次修改 2019-08-09

多行输入框。

属性名 类型 默认值 说明 最低版本
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

WARNING

  1. 请勿在 scroll-view、swiper、picker-view 中使用 textarea 组件
  2. css 动画对 textarea 组件无效
  3. 如果样式上设置为fixed元素,请在组件上添加fixed属性

示例


开发者工具中预览

<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'})
  }
})


以上内容是否对您有帮助:
二维码
建议反馈
二维码