快應(yīng)用 textarea組件

2020-08-08 15:35 更新

概述

提供可交互的界面,接收用戶的輸入,默認(rèn)為多行

子組件

不支持

屬性

支持 通用屬性

名稱(chēng)類(lèi)型默認(rèn)值必填描述
placeholder<string>-提示文本的內(nèi)容
maxlength 1010+<number>-組件可接收用戶輸入字符的最大長(zhǎng)度

樣式

支持 通用樣式

名稱(chēng)類(lèi)型默認(rèn)值必填描述
color<color>rgba(0, 0, 0, 0.87)文本顏色
font-size<number>37.5px文本尺寸
placeholder-color<color>rgba(0, 0, 0, 0.38)提示文本的顏色
caret-color 1060+<color> | auto | transparentauto光標(biāo)顏色,默認(rèn)值為auto,與文本顏色一致

事件

支持 通用事件

名稱(chēng)參數(shù)描述
change{text:newText}輸入內(nèi)容發(fā)生變化時(shí)觸發(fā)
selectionchange 1030+-選中文本改變和光標(biāo)移動(dòng)時(shí)觸發(fā)
linechange 1060+{height: <number>, lineCount: <number>}輸入框行數(shù)變化時(shí)調(diào)用,height為當(dāng)前輸入框高度,lineCount為當(dāng)前文本行數(shù)

方法

名稱(chēng)參數(shù)描述
focus{focus:true|false},focus 不傳默認(rèn)為 true使組件獲得或者失去焦點(diǎn),可觸發(fā) focus 偽類(lèi),可彈出或收起輸入法
select 1010+-選中文本框的全部文本
setSelectionRange 1010+{start: <number>, end: <number>}設(shè)置文本框的選中區(qū)域
getSelectionRange 1010+{callback: Function(start: <number>, end: <number>)}獲取文本的選中區(qū)域

textarea   示例代碼

<template>
    <div style="flex-direction:column;">
        <textarea onchange="change">{{name}}</textarea>
        <input type="button" value="click" onclick="handle" ></input>
    </div>
</template>

<script>
  export default {
    private: {
      name:'my'
    },
    handle(){
      console.log(this.name)
    },
    change(e){
      this.name = e.text
      //console.log(e)
    },
  }
</script>

注意

textarea手動(dòng)賦值,請(qǐng)采用
<textarea>{{name}}</textarea>

在ide中可能會(huì)存在警告,請(qǐng)暫時(shí)忽略該警告,后期我們會(huì)改善。

textarea

快應(yīng)用目前采用數(shù)據(jù)單向流,需要監(jiān)聽(tīng)textarea的chagne事件,手動(dòng)給name賦值。

更多詳細(xì)示例,請(qǐng)查看 示例代碼


以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)