微信小程序 textarea 組件詳解及簡單實例
更新時間:2017年01月10日 15:08:48 投稿:lqh
這篇文章主要介紹了微信小程序 textarea 組件詳解及簡單實例的相關(guān)資料,需要的朋友可以參考下
微信小程序textarea
相關(guān)文章:
多行輸入框。
屬性名 | 類型 | 默認值 | 說明 |
---|---|---|---|
value | String | 輸入框的內(nèi)容 | |
placeholder | String | 輸入框為空時占位符 | |
placeholder-style | String | 指定 placeholder 的樣式 | |
placeholder-class | String | textarea-placeholder | 指定 placeholder 的樣式類 |
disabled | Boolean | false | 是否禁用 |
maxlength | Number | 140 | 最大輸入長度,設(shè)置為0的時候不限制最大長度 |
auto-focus | Boolean | false | 自動聚焦,拉起鍵盤。頁面中只能有一個 <textarea/> 或<input/> 設(shè)置 auto-focus 屬性 |
focus | Boolean | false | 獲取焦點(開發(fā)工具暫不支持) |
auto-height | Boolean | false | 是否自動增高,設(shè)置auto-height時,style.height不生效 |
bindfocus | EventHandle | 輸入框聚焦時觸發(fā),event.detail = {value: value} | |
bindblur | EventHandle | 輸入框失去焦點時觸發(fā),event.detail = {value: value} | |
bindlinechange | EventHandle | 輸入框行數(shù)變化時調(diào)用,event.detail = {height: 0, heightRpx: 0, lineCount: 0} |
示例代碼:
<!--textarea.wxml--> <view class="section"> <textarea bindblur="bindTextAreaBlur" auto-height placeholder="自動變高" /> </view> <view class="section"> <textarea placeholder="placeholder顏色是紅色的" placeholder-style="color:red;" /> </view> <view class="section"> <textarea placeholder="這是一個可以自動聚焦的textarea" auto-focus /> </view> <view class="section"> <textarea placeholder="這個只有在按鈕點擊的時候才聚焦" focus="{{focus}}" /> <view class="btn-area"> <button bindtap="bindButtonTap">使得輸入框獲取焦點</button> </view> </view>
//textarea.js Page({ data: { height: 20, focus: false }, bindButtonTap: function() { this.setData({ focus: true }) }, bindTextAreaBlur: function(e) { console.log(e.detail.value) } })
Bug & Tipbug
: 微信版本 6.3.30
,textarea
在列表渲染時,新增加的 textarea
在自動聚焦時的位置計算錯誤tip
: 請勿在 scroll-view
中使用 textarea
組件
感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持!
相關(guān)文章
JS構(gòu)造函數(shù)和實例化的關(guān)系及原型引入
這篇文章主要介紹了JS構(gòu)造函數(shù)和實例化的關(guān)系及原型引入,下文圍繞JS構(gòu)造函數(shù)和實例化的關(guān)系及原型引入的西安海關(guān)資料展開全文內(nèi)容,需要的朋友可以參考一下,希望對大家有所幫助2021-11-11微信小程序Server端環(huán)境配置詳解(SSL, Nginx HTTPS,TLS 1.2 升級)
這篇文章主要介紹了微信小程序Server端環(huán)境配置詳解(SSL, Nginx HTTPS,TLS 1.2 升級)的相關(guān)資料,需要的朋友可以參考下2017-01-01