快應(yīng)用 input組件

2020-08-08 12:00 更新

概述

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

子組件

不支持

屬性

支持 通用屬性

名稱類型默認(rèn)值必填描述
typebutton | checkbox | radio | text | email | date | time | number | password | tel1050+text支持動態(tài)修改 1030+
checked<boolean>false當(dāng)前組件的 checked 狀態(tài),可觸發(fā) checked 偽類,type 為 checkbox 時(shí)生效
name<string>-input 組件名稱
value<string>-input 組件的值
placeholder<string>-提示文本的內(nèi)容,type 為 text|email|date|time 時(shí)生效
maxlength 1010+<number>-組件可接收用戶輸入字符的最大長度
enterkeytype 1010+default | send | search | next | go | done |default設(shè)置軟鍵盤 Enter 按鈕的顯示文本或圖標(biāo).
autocomplete 1050+on | offon是否開啟自動提示功能,當(dāng) type 為 tel 時(shí)生效

樣式

支持 通用樣式

名稱類型默認(rèn)值必填描述
color<color>rgba(0, 0, 0, 0.87)文本顏色
font-size<number>37.5px文本尺寸
placeholder-color<color>rgba(0, 0, 0, 0.38)提示文本的顏色,type 為 text|email|date|time 時(shí)生效
width<length> | <percentage>-type 為 button 時(shí),默認(rèn)值為 128px
height<length> | <percentage>-type 為 button 時(shí),默認(rèn)值為 70px
caret-color 1060+<color> | auto | transparentauto光標(biāo)顏色,默認(rèn)值為auto,與文本顏色一致

事件

支持 通用事件

支持change事件,input組件的值、checked狀態(tài)發(fā)生變化時(shí)觸發(fā)

名稱 參數(shù) 描述
change 不同 type 參數(shù)不同,具體見下方 change 事件參數(shù) input 組件的值、狀態(tài)發(fā)生改變時(shí)觸發(fā), type 為 button 時(shí)無 change 事件
enterkeyclick 1010+ {value:valueString},value 為用戶輸入的值 軟鍵盤 Enter 鍵點(diǎn)擊事件
selectionchange 1030+ - 選中文本改變和光標(biāo)移動時(shí)觸發(fā)

change 事件參數(shù)

參數(shù) text | email | date | time | number | password checkbox radio 備注
name
value
checked
text deprecated

方法

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

input   示例代碼

查看 示例代碼


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

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號