1. 添加属性screenHeight 和 timer。

screenHeight: window.innerHeight

timer: '' //  window.onresize函数频繁调用时，页面抖动较大，设定间隔

2. 在mounted 钩子函数中监听onresize事件

let that = this

window.onresize = () => {

if (!that.timer) {

that.timer = true

setTimeout(() => {

that.timer = false

that.screenHeight = window.innerHeight

}, 600)

}

}

3. h5 新单位 vh,vw

Vue：window.onresize的更多相关文章

  1. window.onresize监听事件

    window.onresize监听事件 onresize 事件会在窗口或框架被调整大小时发生. 支持onresize的标签:<a>, <address>, <b>, ...

  2. window.onresize 事件笔记

     1.浏览器尺寸变化响应事件 : window.onresize = function(){....} 这里须要注意的是,onresize响应事件处理中.获取到的页面尺寸參数是变更后的參数. // ...

  3. window.onresize事件在vue项目中的应用

    //vue页面<template> <div id='echart'> 报表 </div> </template> <script> exp ...

  4. vue 中监听窗口发生变化，触发监听事件， window.onresize && window.addEventListener('resize'，fn) ，window.onresize无效的处理方式

    // 开始这样写,不执行 window.onresize = function() { console.log('窗口发生变化') } // 改成window监听事件 window.addEventL ...

  5. vue中使用两个window.onresize问题解决

    在vue开发中,因为引用的父组件和子组件都使用了window.onresize以至于一个window.onresize失效.找了下解决方案,可以采用下面的方式写就可以了. window.onresiz ...

  6. window.onresize 多次触发的解决方法

    用了window.onresize但是发现每次 onresize 后页面中状态总是不对,下面与大家分享下onresize 事件多次触发的解决方法. 之前做一个扩展,需要在改变窗口大小的时候保证页面显示 ...

  7. 关于window.onresize

    window.ss1 = function() { alert("aaa") } window.ss = function() { alert("bbb") } ...

  8. Echarts同一页面多个图表自适应浏览器窗口大小——window.onresize

    当前做的一个项目中,频繁使用到百度团队的Echarts,发在一个页面同时出现多个图表时,只有最后一个图表触发了window.onresize事件,查询官方文档后得到解决. 方法如下: hwChart. ...

  9. 20181019 记录 window.setTimeout('dofunction()',2000); - layui form 表单提交 事件 - F11全屏 事件 window.onresize

    1 延时事件 window.setTimeout('dofunction()',2000); 函数外面要有引号 如果没有引号 就不能延时执行 应该是内容进行eval,所以外层不是传递字符串的话,外层函 ...

随机推荐

  1. XML fragments parsed from previous mappers already contains value for xxxxx

    错误信息: Caused by: org.springframework.core.NestedIOException: Failed to parse mapping resource: 'file ...

  2. h5手机查看

    1.装个node:2.全局装个anywhere的npm包.(npm i -g anywhere)3.大功告成,现在到任意目录下用命令行执行anywhere就可以:(-p 参数可以设置启动端口) 补充: ...

  3. x86汇编寄存器，函数参数入栈说明

    https://en.wikipedia.org/wiki/X86_calling_conventions

  4. BlockQueue 解析

    生产者.消费者模式 https://www.jianshu.com/p/024a36b83099

  5. Redis读取出错，JSON序列化的问题

    报错 org.springframework.web.util.NestedServletException: Request processing failed; nested exception ...

  6. 最简单的JAVA解析XML字符串方法

    引入 dom4j 包<dependency> <groupId>dom4j</groupId> <artifactId>dom4j</artifa ...

  7. Alibaba Java开发手册索引规约学习笔记

    最近一段时间再看阿里巴巴 Java开发手册索引规约,写篇帖子总结一下,索引规约内容如下 为了通用,更为了避免造数据的痛苦,文中所涉及表.数据,均来自于MySQL官网提供的示例库employees,可通 ...

  8. 如何快速上手Mac

    网络上关于Mac的教程很多,大部分问题通过百度和谷歌就能搞定了.对于技巧的细节,我将不再过多的重复,看了我的参考资料基本就能够全部了解,他们也比我讲得详细得很多.我这篇文章想做的,是以一个普通的win ...

  9. linux下实用的快速随机生成复杂密码

    linux下实用的快速随机生成复杂密码 [root@test.db-audit.1 ~]# </dev/urandom tr -dc '1234567890!@#$%abcdefghigklmn ...

  10. Money King【题解】

    我又傻了……竟然忘了区别大根堆和小根堆的性质,以至于一个符号打错,debug了半天……(我真是太菜了……) 题目描述 Once in a forest, there lived N aggressiv ...