uni-app page模块提供了控制页面的方法，使用方法有：1、“page.$('.index-desc')”；2、“page.$$('.list-text')”；3、“await page.waitfor('picker')”等等。
本文操作环境：Windows7系统、uni-app2.5.1版，DELL G3电脑
uni-app page的用法是什么？
uni-app之Page——控制页面的方法
行盟APP1.0 php版
下载
行盟APP是结合了通信和互联网的优势，加之云计算所拥有的强大信息资源，借助广大的终端传递服务，潜在的拥有巨大商机。她到底是什么，又有什么作用？她是一款手机应用软件；她是一款专门为企业服务的手机应用软件；她是一款能够将企业各种信息放入其中并进行推广传播的手机应用软件！只要轻轻一点，企业的简介，产品信息以及其他优势就能最快最大限度的透过手机展现在客户的眼前，一部手机，一个APP，你面对的将是一个6亿&
Page 模块提供了控制页面的方法。
Page的属性
| 属性 | 描述 | 返回类型 |
| path | 页面路径 | String |
| query | 页面参数 | Object |
| data | 页面的渲染数据 | Object |
Page的方法
| 方法 | 参数 | 描述 | 返回值 |
| $ | (selector: string) |
获取页面元素 | Element |
| $$ | <code>(selector: string) |
获取页面元素数组 | <code>Element[] |
| waitFor | <code><code>(condition: string | number | Function) |
等待直到条件成立 | <code><code>void |
| data | <code><code><code>(path?: String) |
获取页面渲染数据 | <code><code><code>Object |
| setData | <code><code><code><code><code><code><code>(data: Object) |
设置页面渲染数据 | <code><code><code>Object |
| size | <code><code><code><code><code><code><code>无 |
获取页面的大小 | <code><code><code>Object |
| scrollTop | <code><code><code><code><code><code><code>无 |
获取页码滚动位置 | <code><code><code>Number |
| callMethod | <code><code><code><code><code><code><code><code>(method: string, ...args: any[]) |
调用页面的指定方法 | <code><code><code>any |
page.$()方法
$()方法用于获取页面的元素。$方法的输入参数说明：
| 字段 | 类型 | 必填 | 默认值 | 说明 |
selector |
String | 是 | 选择器 |
示例代码如下：
1 const page = await program.currentPage()
2 const element = await page.$('.index-desc')
3 console.log(element.tagName) // 'view'page.$$()方法
$$()方法用于获取页码元素数组。$$方法的输入参数说明：
| 字段 | 类型 | 必填 | 默认值 | 说明 |
selector |
String | 是 | 选择器 |
示例代码如下：
1 const page = await program.currentPage()
2 const elements = await page.$$('.list-text')
3 console.log(elements.length)Page.waitFor()方法
waitFor()方法用于等待直到条件成立。waitFor方法参数说明
| 字段 | 类型 | 必填 | 默认值 | 说明 |
condition |
String Number Function | 是 | 等待条件 |
- 如果条件是string类型时，那么该参数会被当成选择器，当该选择器选中元素个数不为零时，结束等待。
- 如果条件是number，那么该参数会被当成超时时长，当经过指定时间后，结束等待。
- 如果条件是FUnction类型，那么该参数会被当成断言函数，当该函数返回真时，结束等等。
示例代码如下：
1 const page = await program.currentPage() await page.waitFor(5000) // 等待 5 秒
2 await page.waitFor('picker') // 等待页面中出现 picker 元素
3 await page.waitFor(async() = >{
4 return (await page.$$('picker')).length > 5
5 })； // 等待页面中 picker 元素数量大于 5Page.data()方法
data()方法用于获取页码数据。data()方法参数如下：
| 字段 | 类型 | 必填 | 默认值 | 说明 |
path |
String | 否 | 数据路径 |
示例代码如下：
1 const page = await program.currentPage();
2 console.log(await page.data('list'));Page.setData（）方法
setData()方法用于设置页面的渲染数据。setData()方法参数如下：
| 字段 | 类型 | 必填 | 默认值 | 说明 |
data |
Object | 是 | 要改变的数据 |
示例代码如下：
1 const page = await program.currentPage();
2 await page.setData({
3 text: 'changed data'4 });Page.size()方法
size()方法获取页面的大小。size()的返回值如下：
| 字段 | 类型 | 说明 |
| width | number | 页面可滚动宽度 |
| height | number | 页面可滚动高度 |
Page.callMethod（） 方法
callMethod()方法用于调用页面的指定方法。callMethod()的参数说明如下：
| 字段 | 类型 | 必填 | 默认值 | 说明 |
method |
String | 是 | - | 需要调用的方法名 |
...args |
array | 否 | - | 方法参数 |
推荐学习：《uni-app教程》
