uni-app page模塊提供了控制頁面的方法，使用方法有：1、“page.$('.index-desc')”；2、“page.$$('.list-text')”；3、“await page.waitFor('picker')”等等。

本文操作環(huán)境：Windows7系統(tǒng)、uni-app2.5.1版，DELL G3電腦

uni-app page的用法是什么？

uni-app之Page——控制頁面的方法

Page 模塊提供了控制頁面的方法。

Page的屬性

Page的方法

page.$()方法

$()方法用于獲取頁面的元素。$方法的輸入?yún)?shù)說明：

示例代碼如下：

1 const page = await program.currentPage() 2 const element = await page.$('.index-desc') 3 console.log(element.tagName) // 'view'

page.$$()方法

$$()方法用于獲取頁碼元素數(shù)組。$$方法的輸入?yún)?shù)說明：

示例代碼如下：

1 const page = await program.currentPage() 2 const elements = await page.$$('.list-text') 3 console.log(elements.length)

Page.waitFor()方法

waitFor()方法用于等待直到條件成立。waitFor方法參數(shù)說明

• 如果條件是string類型時，那么該參數(shù)會被當(dāng)成選擇器，當(dāng)該選擇器選中元素個數(shù)不為零時，結(jié)束等待。
• 如果條件是number，那么該參數(shù)會被當(dāng)成超時時長，當(dāng)經(jīng)過指定時間后，結(jié)束等待。
• 如果條件是FUnction類型，那么該參數(shù)會被當(dāng)成斷言函數(shù)，當(dāng)該函數(shù)返回真時，結(jié)束等等。

示例代碼如下：

1 const page = await program.currentPage() await page.waitFor(5000) // 等待 5 秒 2 await page.waitFor('picker') // 等待頁面中出現(xiàn) picker 元素 3 await page.waitFor(async() = >{ 4     return (await page.$$('picker')).length > 5 5 })； // 等待頁面中 picker 元素數(shù)量大于 5

Page.data()方法

data()方法用于獲取頁碼數(shù)據(jù)。data()方法參數(shù)如下：

示例代碼如下：

1 const page = await program.currentPage(); 2 console.log(await page.data('list'));

Page.setData（）方法

setData()方法用于設(shè)置頁面的渲染數(shù)據(jù)。setData()方法參數(shù)如下：

示例代碼如下：

1 const page = await program.currentPage(); 2 await page.setData({ 3     text: 'changed data'4 });

Page.size()方法

size()方法獲取頁面的大小。size()的返回值如下：

Page.callMethod（） 方法

callMethod()方法用于調(diào)用頁面的指定方法。callMethod()的參數(shù)說明如下：

推薦學(xué)習(xí)：《uni-app教程》