摘要:太懶了,早就想寫這個系列了,知道今天才開始動筆,暫且就從這里開始吧。本該到此就結(jié)束了。不過那是不可能的。到此為止問題基本解決了,關(guān)于和的問題也提了給的官方團(tuán)隊,鏈接地址最后,非常感謝團(tuán)隊的耐心解答,真的非常。
太懶了,早就想寫這個系列了,知道今天才開始動筆,暫且就從這里開始吧。
項(xiàng)目腳手架:Taro + TaroUI
問題:
TaroUI的Modal彈層在軟鍵盤彈起的時候無法被頂上去,效果圖
去群里問了問大佬,建議說給Input的cursorSpacoing大一點(diǎn)的值。
代碼:
結(jié)果OK了。
本該到此就結(jié)束了。不過那是不可能的。有小伙伴肯定發(fā)現(xiàn)了,我給的cursorSpacing是定值,在適配機(jī)型的時候肯定不合適,所以我們需要拿到Modal的位置信息,Taro文檔里給出了拿到組件或DOM實(shí)例的api,
Taro.createSelectorQuery()
代碼:
const query = Taro.createSelectorQuery() .select(".add_book_modal") .boundingClientRect(); query.exec(res => { console.log(res, "modal"); });
res就是我們能拿到的組件實(shí)例信息,但是我在調(diào)試的時候打印出來的確實(shí)["null"],
查看wxml發(fā)現(xiàn)我的className屬性根本就沒有賦到組件上
(this.addBookModal = modal)} className="add_book_modal" class="add_book_modal"> 書籍信息 書籍名 作者
這是整個Modal組件,可以看到我在Modal上給了一個className,不過無效,后來我又想到TaroUI文檔里說如果想要自定義樣式的話可以給組件一個class,覆蓋組件樣式,我就試著給Modal一個class,查看wxml發(fā)現(xiàn)組件有這個樣式,然后就理所當(dāng)然的拿到了位置信息。
到此為止問題基本解決了,關(guān)于class和className的問題也提了issue給TaroUI的官方團(tuán)隊,
鏈接地址
最后,非常感謝TaroUI團(tuán)隊的耐心解答,真的非常nice。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/108586.html
摘要:多端統(tǒng)一開發(fā)框架優(yōu)秀學(xué)習(xí)資源匯總官方資源項(xiàng)目倉庫官方文檔項(xiàng)目倉庫官方文檔微信小程序官方文檔百度智能小程序官方文檔支付寶小程序官方文檔字節(jié)跳動小程序官方文檔文章教程不敢閱讀包源碼帶你揭秘背后的哲學(xué)從到構(gòu)建適配不同端微信小程序等的應(yīng)用小程序最 Awesome Taro 多端統(tǒng)一開發(fā)框架 Taro 優(yōu)秀學(xué)習(xí)資源匯總 showImg(https://segmentfault.com/img/r...
摘要:接下來,在支付寶小程序開發(fā)者工具中打,不出意外能跑起來一個電商支付寶小程序雛形。地址以上是我這個攻城獅對使用轉(zhuǎn)換原生微信小程序?yàn)橹Ц秾毿〕绦虻囊淮挝⒉蛔愕赖膶?shí)踐。 showImg(https://segmentfault.com/img/bVbnCCN?w=1818&h=931);↑開局一張圖,故事全靠編↑ 從一個需求說起 作為底層的程序猿,哦不,我連猿都算不上,混的好的叫碼神,混得一...
摘要:個人所有文章同步到前言最近公司準(zhǔn)備開發(fā)幾款可以在微信小程序端和端同時運(yùn)行的一套商城,接著就是任務(wù)下發(fā)嘍,但是有一點(diǎn),時間緊任務(wù)重,直接說其他的不管,反正幾個星期之內(nèi)必須上線,頭疼。 個人所有文章同步到:https://github.com/zhengzhuan... 前言 最近公司Boss準(zhǔn)備開發(fā)幾款可以在微信小程序端和H5端同時運(yùn)行的一套商城,接著就是任務(wù)下發(fā)嘍,但是有一點(diǎn),時間緊任...
閱讀 1399·2021-09-02 09:53
閱讀 2667·2021-07-29 13:50
閱讀 1714·2019-08-30 11:07
閱讀 1570·2019-08-30 11:00
閱讀 1449·2019-08-29 14:00
閱讀 1843·2019-08-29 12:52
閱讀 2559·2019-08-29 11:11
閱讀 3415·2019-08-26 12:23