分享最實(shí)用的技術(shù),創(chuàng)造更大的價(jià)值

微信小程序開(kāi)發(fā)自定義頭部bar后,input軟鍵盤(pán)彈起時(shí)頁(yè)面整體上移

微信小程序開(kāi)發(fā)自定義頭部bar后input軟鍵盤(pán)彈起時(shí)頁(yè)面整體上移解決方法


經(jīng)過(guò)創(chuàng)軟小程序開(kāi)發(fā)團(tuán)隊(duì)的檢查測(cè)試,發(fā)現(xiàn)在微信小程序textarea的屬性上增加: cursor-spacing 屬性即可,如:

<textarea  cursor-spacing='10' maxlength="-1" ></textarea>



網(wǎng)上找的其它文章,解決小程序鍵盤(pán)彈出遮擋頂部bar有一下方法做參考:


1,設(shè)置adjust-position屬性(詳細(xì)參見(jiàn)小程序官方文檔)

<input value="{{value}}" bindinput="bindinput" confirm-type="send" adjust-position="{{inputUp}}" bindfocus="inputFocus" bindblur="inputBlur"></input>


2,通過(guò)以上設(shè)置,鍵盤(pán)彈出時(shí)整體頁(yè)面不上移,接下來(lái)就需要獲取到軟鍵盤(pán)的高度,為頁(yè)面添加padding-bottom即可


小程序中獲取鍵盤(pán)高度代碼

inputFocus(e) {
    console.log(e,'鍵盤(pán)彈起')
    var inputHeight = 0
    if (e.detail.height) {
      inputHeight = e.detail.height
    }
},
inputBlur() {
    console.log('鍵盤(pán)收起')
},



請(qǐng)注意:在小程序開(kāi)發(fā)編輯器中e.detail中只有value,沒(méi)有height,真機(jī)上才有


聯(lián)系
QQ
電話
咨詢電話:189-8199-7898
TOP