vue获取屏幕高度并赋值给盒子

html:<div class="contentLeft"><div id="echartBox" ref="echartBox"></div>
</div>js:
data() {return {clientHeight: "", // echarts高度动态改变};
},
watch: {// 实时监听年度变化，等于当年年度则不可操作year: {deep: true,immediate: true,handler: function (newVal) {if (Number(newVal) == 2021) {this.noChange = true;} else {this.noChange = false;}},},// 监听屏幕高度变化clientHeight: function () {this.changeHeight(this.clientHeight);}
},
mounted() {//获取屏幕可视化的高度；this.clientHeight=`${document.documentElement.clientHeight}`;/ /屏幕大小发生改变触发 window.onresizewindow.onresize = function temp() { this.clientHeight = `${document.documentElement.clientHeight}`;};
},methods: {changeFixed(clientHeight) {//动态修改样式(总高度减去头部固定的高度)this.$refs.echartBox.style.height = clientHeight - 215 + 'px';},
}

只要在路上，总会有光照！

vue获取屏幕高度并赋值给盒子相关推荐

vue原生获取屏幕高度
vue原生获取屏幕高度 1.全界面 2.组件中 vue原生获取屏幕高度技术胖pos实战练习知识点视频链接 1.全界面 .main{float: left;width: 100%;height: 1 ...
android屏幕密度高度,Android获取常用辅助方法(获取屏幕高度、宽度、密度、通知栏高度、截图)...
我们需要获取Android手机或Pad的屏幕的物理尺寸,以便于界面的设计或是其他功能的实现.下面就分享一下Android中常用的一些辅助方法: 获取屏幕高度: /** * 获得屏幕高度 * @para ...
js和jQuery 获取屏幕高度、宽度
js获取屏幕高度,宽带网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body ...
android如何获取分屏区域的宽高,Android N获取屏幕高度的问题
获取屏幕高度的代码 int getScreenHeight(Activity context) { WindowManager wm = (WindowManager)context.getSyste ...
获取屏幕高度——浏览器高度、控制台高度、工具栏高度
今天想写一个效果,进入网站顶部导航栏需要一个全屏背景图,这个需要根据不同的屏幕大小适应不同的高度(不能使用height为100%,这个涉及到最外层容器的高度,容易造成高度塌陷),所以需要一个确定高度值 ...
Android 获取屏幕高度，虚拟导航键检测
本篇文章主要总结一下在全面屏上获取高度的问题. 获取屏幕高度一般 Android 上获取设备的高度都是通过 DefaultDisplay 的方式来获取的如下: public int getScree ...
聊聊获取屏幕高度这件事
问题的起因是我发现 PopupWindow弹出位置不正确时发现的.其实早在两年多前,我就发现我手上的小米MIX2s 获取屏幕高度不正确,后面参考V2EX 的这篇帖子处理了.最近又一次做到类似功能,发现 ...
小程序中获取屏幕高度
屏幕高度问题小程序中有时候需要获取屏幕高度使用,简单的通过wx.getSystemInfo即可获取到手机的系统信息 wx.getSystemInfo中有3个高度,分别是: screenHeight: ...
华为手机获取状态栏高度是错误的_聊聊获取屏幕高度这件事
问题的起因是我发现 PopupWindow弹出位置不正确时发现的.其实早在两年多前,我就发现我手上的小米MIX2s 获取屏幕高度不正确,后面参考V2EX 的这篇帖子处理了.最近又一次做到类似功能,发现 ...

vue获取屏幕高度并赋值给盒子

vue获取屏幕高度并赋值给盒子相关推荐

最新文章

热门文章