Bagaimana untuk mendapatkan ketinggian kandungan dalam uniapp

Uniapp ialah rangka kerja pembangunan merentas platform berdasarkan Vue.js, yang boleh menyusun kod yang sama ke dalam aplikasi untuk berbilang platform. Antaranya, untuk persembahan kandungan pada platform yang berbeza, ketinggian mungkin perlu dilaraskan secara dinamik.

Dalam Uniapp, anda boleh mendapatkan ketinggian kandungan melalui kaedah berikut:

1. Gunakan kaedah uni.createSelectorQuery()

uni. kaedah createSelectorQuery() Ia adalah salah satu API dalam Uniapp untuk mendapatkan maklumat komponen Ia boleh mendapatkan pelbagai maklumat tentang komponen, termasuk lebar, ketinggian, maklumat kedudukan, dsb. Selepas mendapatkan maklumat komponen, anda boleh menggunakan fungsi panggil balik untuk melaksanakan operasi.

Sebagai contoh, jika anda perlu mendapatkan maklumat ketinggian komponen paparan, anda boleh meneruskan seperti berikut:

uni.createSelectorQuery().select('.view-class').boundingClientRect((rect)=>{
    console.log(rect.height);
}).exec()

Antaranya, parameter '.view-class' ialah nama gaya daripada komponen paparan, . Kaedah boundingClientRect() boleh mendapatkan maklumat kedudukan dan saiz komponen, dan fungsi panggil balik (rect) ialah maklumat berkaitan komponen yang diperolehi.

2. Menggunakan API uni@v3

Dalam versi Uniapp v3, API telah dinaik taraf dan diubah dengan ketara, termasuk penambahan API baharu.

Dengan menggunakan API uni@v3, anda boleh mendapatkan maklumat nod secara langsung dalam halaman dan anda boleh menggunakan sintaks await untuk melaksanakan operasi tak segerak.

Mengenai mendapatkan ketinggian dalam API uni@v3, anda boleh meneruskan seperti berikut:

async function getHeight() {
    const query = uni.createSelectorQuery();
    await new Promise(resolve => {
        query.select('.view-class').boundingClientRect();
        query.exec(res => {
            console.log(res[0].height);
            resolve();
        });
    });
}

Pernyataan query.select('.view-class').boundingClientRect() memilih komponen dan memperoleh Untuk ketinggiannya, gunakan Promise untuk membiarkan operasi tak segerak menunggu ketinggian diperoleh sebelum meneruskan untuk melaksanakan keputusan pertanyaan disimpan dalam res, dan maklumat ketinggian diperoleh melalui res[0].height.

Ringkasan:

Melalui dua kaedah di atas, kita boleh mendapatkan maklumat ketinggian komponen dalam Uniapp, dan melaraskan serta mengendalikannya mengikut keperluan. Dalam pembangunan sebenar, anda perlu mengkaji dengan mendalam dan menguasai API serta pengetahuan berkaitan dalam Uniapp untuk mengaplikasikannya dengan lebih baik dalam pembangunan.

Atas ialah kandungan terperinci Bagaimana untuk mendapatkan ketinggian kandungan dalam uniapp. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!