DomSize使用

最新推荐文章于 2024-09-13 08:33:26 发布

study_azhuo

最新推荐文章于 2024-09-13 08:33:26 发布

阅读量208

点赞数

分类专栏：前端问题汇总文章标签： Vue 表格窗口适配 DomSize wd-domsize-monitor

本文链接：https://blog.csdn.net/study_azhuo/article/details/120200321

版权

前端问题汇总专栏收录该内容

12 篇文章 0 订阅

订阅专栏

使用VUE时想用表格进行数据展示但是网页大小变化时，表格不会和背景一样跟着窗口变动，使用DomSize进行表格窗口自适应

1.npm下载

npm install --save wd-domsize-monitor

2.Vue项目导入

import DomSize from 'wd-domsize-monitor';

3.对指定dom元素进行绑定

		mounted() {
		//$refs当前dom元素  table是div中ref属性的值
			var this_ = this;
			DomSize.bind(this_.$refs.table, function() {
				var height = this_.$refs.table.offsetHeight;
				this_.tableHegiht = height - 220
			});
		},
		beforeUpdate() {
			var this_ = this;
			var height = this_.$refs.table.offsetHeight;
			this_.tableHegiht = height - 220
		},