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——控制页面的方法
Page 模块提供了控制页面的方法。
Page的属性
属性描述返回类型path页面路径Stringquery页面参数Object data 页面的渲染数据 Object
Page的方法
方法参数描述返回值$(selector: string)获取页面元素Element$$(selector: string)获取页面元素数组Element[]waitFor(condition: string | number | Function)等待直到条件成立voiddata(path?: String)获取页面渲染数据ObjectsetData(data: Object)设置页面渲染数据Objectsize无获取页面的大小ObjectscrollTop无获取页码滚动位置NumbercallMethod(method: string, …args: any[])调用页面的指定方法any
page.$()方法
$()方法用于获取页面的元素。$方法的输入参数说明:
字段类型必填默认值说明selectorString是 选择器
示例代码如下:
1 const page = await program.currentPage()2 const element = await page.$('.index-desc')3 console.log(element.tagName) // 'view'
登录后复制
page.$$()方法
$$()方法用于获取页码元素数组。$$方法的输入参数说明:
字段类型必填默认值说明selectorString是 选择器
示例代码如下:
1 const page = await program.currentPage()2 const elements = await page.$$('.list-text')3 console.log(elements.length)
登录后复制
Page.waitFor()方法
waitFor()方法用于等待直到条件成立。waitFor方法参数说明
字段类型必填默认值说明conditionString 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 > 55 }); // 等待页面中 picker 元素数量大于 5
登录后复制
Page.data()方法
data()方法用于获取页码数据。data()方法参数如下:
字段类型必填默认值说明pathString否 数据路径
示例代码如下:
1 const page = await program.currentPage();2 console.log(await page.data('list'));
登录后复制
Page.setData()方法
setData()方法用于设置页面的渲染数据。setData()方法参数如下:
字段类型必填默认值说明dataObject是 要改变的数据
示例代码如下:
1 const page = await program.currentPage();2 await page.setData({3 text: 'changed data'4 });
登录后复制
Page.size()方法
size()方法获取页面的大小。size()的返回值如下:
字段类型说明widthnumber页面可滚动宽度heightnumber页面可滚动高度
Page.callMethod() 方法
callMethod()方法用于调用页面的指定方法。callMethod()的参数说明如下:
字段类型必填默认值说明methodString是 -需要调用的方法名…args array否-方法参数
推荐学习:《uni-app教程》
以上就是uni-app page的用法是什么的详细内容,更多请关注【创想鸟】其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。
发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3030764.html