ユニアプリページの使い方は何ですか?

uni-app ページ モジュールは、ページを制御するためのメソッドを提供します。使用方法は次のとおりです: 1. "page.$('.index-desc')"; 2. "page.$$('.list - text')"; 3. "await page.waitFor('picker')" など。

この記事の動作環境: Windows 7 システム、ユニアプリ バージョン 2.5.1、DELL G3 コンピューター

使用方法ユニアプリページとは何ですか？

uni-app のページ——ページを制御するメソッド

Page モジュールは、ページを制御するメソッドを提供します。

ページのプロパティ

##pathページ パスStringqueryページパラメータObject data レンダリングページのデータ # オブジェクト #ページ メソッド

プロパティ	説明	戻り値の型

#パラメータ##(セレクタ: 文字列)##ページ要素を取得#要素(条件: 文字列 | 数値 | 関数)(パス ?: String)なし##scrollTop## callMethod$() メソッドが使用されます 要素を取得しますページの。 $method の入力パラメータの説明: Type

Method	##説明	戻り値	$
	<code>	$$	<code>(セレクタ: 文字列)
ページ要素配列の取得	<code><code>Element[]		waitFor<code><code>
	条件が true になるまで待機します<code><code><code>void		<code><code>data<code>
	<code><code>ページ レンダリング データの取得<code><code>Object		<code><code><code>#setData<code>
## (データ:オブジェクト)	<code><code><code><code><code><code><code><code>#ページ レンダリング データの設定オブジェクト		<code>##サイズ<code><code><code>
	<code><code><code><code><code><code>##ページのサイズを取得します<code><code>オブジェクト		<code><code><code> <code>#なし
	<code><code><code> <code>入手ページ番号のスクロール位置<code><code><code><code>番号		<code><code><code><code>##(メソッド: 文字列, ...引数: 任意[])
	<code><code>#ページ上の指定されたメソッドを呼び出します<code><code><code><code><code><code>any<code>page.$() メソッド		<code><code><code><code>Field

必須文字列Selector

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

page.$$()メソッドFieldType

デフォルト値	説明	セレクター	は	サンプルコードは次のとおりです:
$ $() メソッドは、ページ番号要素配列を取得するために使用されます。 $$ メソッドの入力パラメータの説明: <code>

必須

は

##デフォルト値

説明

セレクター文字列

セレクター

示例代码如下：

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

Page.waitFor()方法

waitFor()方法用于等待直到条件成立。waitFor方法参数说明

字段	类型	必填	默认值	说明
<code>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()方法参数如下：

字段	类型	必填	默认值	说明
<code>path	String	否		数据路径

示例代码如下：

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

Page.setData（）方法

setData()方法用于设置页面的渲染数据。setData()方法参数如下：

字段	类型	必填	默认值	说明
<code>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()的参数说明如下：

字段	类型	必填	默认值	说明
<code>method	String	是	-	需要调用的方法名
<code>...args	array	否	-	方法参数

推荐学习：《uni-app教程》

以上がユニアプリページの使い方は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。