0

0

uni-app page的用法是什么

藏色散人

藏色散人

发布时间:2021-09-15 13:52:20

|

5106人浏览过

|

来源于php中文网

原创

uni-app page模块提供了控制页面的方法,使用方法有:1、“page.$('.index-desc')”;2、“page.$$('.list-text')”;3、“await page.waitFor('picker')”等等。

uni-app page的用法是什么

本文操作环境:Windows7系统、uni-app2.5.1版,DELL G3电脑

uni-app page的用法是什么?

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

行盟APP1.0 php版
行盟APP1.0 php版

行盟APP是结合了通信和互联网的优势,加之云计算所拥有的强大信息资源,借助广大的终端传递服务,潜在的拥有巨大商机。她到底是什么,又有什么作用?她是一款手机应用软件;她是一款专门为企业服务的手机应用软件;她是一款能够将企业各种信息放入其中并进行推广传播的手机应用软件!只要轻轻一点,企业的简介,产品信息以及其他优势就能最快最大限度的透过手机展现在客户的眼前,一部手机,一个APP,你面对的将是一个6亿&

下载

Page 模块提供了控制页面的方法。

Page的属性

属性 描述 返回类型
path 页面路径 String
query 页面参数 Object
 data  页面的渲染数据  Object

Page的方法

方法 参数 描述 返回值
$ (selector: string) 获取页面元素 Element
$$ (selector: string) 获取页面元素数组 Element[]
waitFor (condition: string | number | Function) 等待直到条件成立 void
data (path?: String) 获取页面渲染数据 Object
setData (data: Object) 设置页面渲染数据 Object
size 获取页面的大小 Object
scrollTop 获取页码滚动位置 Number
callMethod (method: string, ...args: any[]) 调用页面的指定方法 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 元素数量大于 5

Page.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教程

相关专题

更多
string转int
string转int

在编程中,我们经常会遇到需要将字符串(str)转换为整数(int)的情况。这可能是因为我们需要对字符串进行数值计算,或者需要将用户输入的字符串转换为整数进行处理。php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

338

2023.08.02

function是什么
function是什么

function是函数的意思,是一段具有特定功能的可重复使用的代码块,是程序的基本组成单元之一,可以接受输入参数,执行特定的操作,并返回结果。本专题为大家提供function是什么的相关的文章、下载、课程内容,供大家免费下载体验。

480

2023.08.04

js函数function用法
js函数function用法

js函数function用法有:1、声明函数;2、调用函数;3、函数参数;4、函数返回值;5、匿名函数;6、函数作为参数;7、函数作用域;8、递归函数。本专题提供js函数function用法的相关文章内容,大家可以免费阅读。

163

2023.10.07

Golang 性能分析与pprof调优实战
Golang 性能分析与pprof调优实战

本专题系统讲解 Golang 应用的性能分析与调优方法,重点覆盖 pprof 的使用方式,包括 CPU、内存、阻塞与 goroutine 分析,火焰图解读,常见性能瓶颈定位思路,以及在真实项目中进行针对性优化的实践技巧。通过案例讲解,帮助开发者掌握 用数据驱动的方式持续提升 Go 程序性能与稳定性。

9

2026.01.22

html编辑相关教程合集
html编辑相关教程合集

本专题整合了html编辑相关教程合集,阅读专题下面的文章了解更多详细内容。

56

2026.01.21

三角洲入口地址合集
三角洲入口地址合集

本专题整合了三角洲入口地址合集,阅读专题下面的文章了解更多详细内容。

28

2026.01.21

AO3中文版入口地址大全
AO3中文版入口地址大全

本专题整合了AO3中文版入口地址大全,阅读专题下面的的文章了解更多详细内容。

385

2026.01.21

妖精漫画入口地址合集
妖精漫画入口地址合集

本专题整合了妖精漫画入口地址合集,阅读专题下面的文章了解更多详细内容。

116

2026.01.21

java版本选择建议
java版本选择建议

本专题整合了java版本相关合集,阅读专题下面的文章了解更多详细内容。

3

2026.01.21

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Java 教程
Java 教程

共578课时 | 49.4万人学习

国外Web开发全栈课程全集
国外Web开发全栈课程全集

共12课时 | 1.0万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号