uni-app获取dom节点信息

问题描述

uni-app无法获取dom节点信息

根据原生js操作dom节点

<video id="video" playsinline style=" display: block;"></video>
onload(){
	const video = document.getElementById('video');
}

在这里插入图片描述


原因及解决方法

uniapp不支持原生操作dom,但是提供了一个接口获取dom信息

在这里插入图片描述


注意:想要拿到元素实例,需要在实例已经挂载到页面上才可以

onLoad() { //页面初始化执行,用户页面获取参数},
onReady() { //页面初次渲染完毕执行},

实现过程

getVideoDom() {
				const video = uni.createSelectorQuery().in(this);
				video.select('#video').boundingClientRect(video => {
					var video = video
					// console.log(video)
				}).exec();
				var ctx = uni.createCanvasContext('output_mini', this);
				console.log(ctx);
},

就可以拿到dom的节点信息啦:

在这里插入图片描述

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐