微信小程式如何取得元素的高度

angryTom
發布: 2020-03-24 15:06:42
原創
14070 人瀏覽過

微信小程式如何取得元素的高度

微信小程式如何取得元素的高度   

1、取得元素的高度(px單位):

let query = wx.createSelectorQuery();
query.select('.content').boundingClientRect(rect=>{
  let height = rect.height;
  console.log(height);
}).exec();
登入後複製

2.取得元素的高度(rpx單位),使用寬高比換算獲得:(以下的750是該元素的寬度,單位是rpx的)

let query = wx.createSelectorQuery();
query.select('.content').boundingClientRect(rect=>{
  let clientHeight = rect.height;
  let clientWidth = rect.width;
  let ratio = 750 / clientWidth;
  let height = clientHeight * ratio;
  console.log(height);
}).exec();
登入後複製

3、在頁面渲染完成OnReady回調,獲取元素高度時,如果不加定時器,所取得的元素的高度還是沒渲染完非同步資料前的高度。故需要加定時器

onReady () {
    setTimeout(() => {
    let query = wx.createSelectorQuery();
    query.select('.content').boundingClientRect(rect=>{
        let height = rect.height;
        console.log(height);
        }).exec();
    }, 300)
}
登入後複製

PHP中文網,大量免費小程式開發教學,歡迎學習!

以上是微信小程式如何取得元素的高度的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板