节点

节点 Node 相关的函数。

函数列表

函数名	说明
getRect()	[详情] 获取单个节点的布局信息
getRects()	[详情] 获取多个节点的布局信息

getRect()

获取单个节点的布局信息。

参数

参数名	类型	默认值	说明
selector	String	-	选择器
instance	Object	-	Vue 实例，通过 getCurrentInstance() 获取到的实例

返回值

类型	说明
``Promise.resolve(Object)	Object 为节点数据对象，[参考]

示例

vue

<template>
	<image class="logo" src="/static/logo.png"></image>
</template>

js

import { ref, getCurrentInstance } from "vue";
import { onReady } from "@dcloudio/uni-app";

onReady(() => {
	const instance = getCurrentInstance();
	uni.$pure.utils.getRect(".logo", instance.proxy).then((data) => {
		// 返回数据参考
		// {
		//     "id": "",
		//     "dataset": {
		//         "v-1cf27b2a": "",
		//         "v1cf27b2a": ""
		//     },
		//     "left": 157.671875,
		//     "right": 272.328125,
		//     "top": 114.65625,
		//     "bottom": 229.3125,
		//     "width": 114.65625,
		//     "height": 114.65625
		// }
		console.log(data);
	});
});

getRects()

获取多个节点的布局信息。

参数

参数名	类型	默认值	说明
selector	String	-	选择器
instance	Object	-	Vue 实例，通过 getCurrentInstance() 获取到的实例

返回值

类型	说明
Promise.resolve(Array[Object])	Array[Object] 为节点数据对象数组，[参考]

示例

vue

<template>
	<image class="logo" src="/static/logo.png"></image>
	<image class="logo" src="/static/logo.png"></image>
</template>

js

import { ref, getCurrentInstance } from "vue";
import { onReady } from "@dcloudio/uni-app";

onReady(() => {
	const instance = getCurrentInstance();
	uni.$pure.utils.getRects(".logo", instance.proxy).then((data) => {
		// 返回数据参考
		// [
		// 	{
		// 		id: "",
		// 		dataset: {
		// 			"v-1cf27b2a": "",
		// 			v1cf27b2a: "",
		// 		},
		// 		left: 157.671875,
		// 		right: 272.328125,
		// 		top: 114.65625,
		// 		bottom: 229.3125,
		// 		width: 114.65625,
		// 		height: 114.65625,
		// 	},
		// 	{
		// 		id: "",
		// 		dataset: {
		// 			"v-1cf27b2a": "",
		// 			v1cf27b2a: "",
		// 		},
		// 		left: 157.671875,
		// 		right: 272.328125,
		// 		top: 372.625,
		// 		bottom: 487.28125,
		// 		width: 114.65625,
		// 		height: 114.65625,
		// 	},
		// ];
		console.log(data);
	});
});