vue---监听浏览器窗口的宽度
使用VUE开发后台项目,后台项目需要进行后台根据浏览器窗口进行变化,需要使用vue来监听浏览器的窗口变化。
<template>
<div class="content" :style="height"></div>
</template> <script>
export default {
name: 'App',
data () {
return {
height:'',
}
},
components:{},
methods:{
getHeight(){
this.height = window.innerHeight - + 'px';
}
},
created(){
window.addEventListener('resize', this.getHeight);
this.getHeight()
},
destroyed(){
window.removeEventListener('resize', this.getHeight)
}
}
</script>
vue---监听浏览器窗口的宽度的更多相关文章
- vue监听浏览器窗口的变化,随着窗口变化调整里面table的宽高
1.在data中设置: tableHeight:"500", screenHeight:window.innerHeight, 2.在mounted中设置: mounted() { ...
- vue监听浏览器窗口大小变化
首先,页面初始化mounted的时候,通过 document.body.clientWidth 和 document.body.clientHeight 来获取到浏览器的宽和高,然后通过 window ...
- vue动态监听浏览器窗口高度
HTML: <div ref="page"></div> JS: data(){ return{ clientHeight:'', } } mounted( ...
- 用jQuery监听浏览器窗口的变化
$(window).resize(function () { //当浏览器大小变化时 alert($(window).height()); //浏览器时下窗口可视区域高度 alert($(docume ...
- JS实时监听浏览器宽度的变化
boot:function(){ //加载页面时执行一次 changeMargin(); //监听浏览器宽度的改变 window.onresize = function(){ changeMargin ...
- vue 监听页面宽度变化 和 键盘事件
vue 监听页面窗口大小 export default { name: 'Full', components: { Header, Siderbar }, data () { return { scr ...
- js监听浏览器tab窗口切换
js监听浏览器tab窗口切换 ——IT唐伯虎 摘要:js监听浏览器tab窗口切换. if (document.hidden !== undefined) { document.addEventLis ...
- vue JS实现监听浏览器返回按键事件
// 这个是监听浏览器回退键的returnButton () { let vm = this; $(document).ready(function () { if (window.history & ...
- Vue 监听鼠标左键 鼠标右键以及鼠标中键修饰符click.left&contextmenu&click.middle
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- IDEA整合SVN遇到的坑
1.安装SVN客户端 注意客户端版本与汉化插件的版本匹配问题,否则汉化无效 2.安装客户端时第二项默认不安装记得要手动选择为安装,否则不会生成svn.exe,这个文件会在IDEA中配置 3.安装客 ...
- Order by 默认排序方式
--ORDER BY 默认排序方式为升序ASC:SELECT * FROM [TABLE_NAME] ORDER BY [COLUMN_NAME] ESC;--升序DESC:SELECT * FROM ...
- 肖哥HCNP-学前准备篇笔记
HCNA:助理 HCNP:工程师 HCIE:专家 vmvare workstation 1.安装 2.创建新的虚拟机-->典型-->稍后安装系统-->选择系统模式-->选择位置 ...
- ES6--不定参数
<一>,在讨论ES6的不定参数之前,我们先一起回顾一下ECMAScript5的无名参数. 早先,javascript提供arguments对象检查函数的所有参数,从而不必定义每一个要用的参 ...
- 初学Django基础02 ORM操作
django的ORM操作 之前我们知道了models.py这个文件,这个文件是用来读取数据结构的文件,每次操作数据时都走这个模块 常用字段 AutoField int自增列,必须填入参数 primar ...
- axio 请求中参数是数组
前言 最近在做 Vue 项目中,Get 请求中有的参数是数组,传 JSON 字符串是没有问题的,但是直接传数组就一直报错,有问题. 参数后面无故加了 [],例如:UserIds 变成 UserIds[ ...
- UVA 13024: Saint John Festival(凸包+二分 ,判定多个点在凸包内)
题意:给定N个点,Q次询问,问当前点知否在N个点组成的凸包内. 思路:由于是凸包,我们可以利用二分求解. 二分思路1:求得上凸包和下凸包,那么两次二分,如果点在对应上凸包的下面,对应下凸包的上面,那么 ...
- linux添加用户adduser出现 useradd:cannot lock /etc/passwd; try again
找一下有个叫/etc/passwd.lock的文件,找到,给它用root删掉就好了,可能是上次使用到这个文件没有正常关闭.具体操作:切换到root用户,用cd etc到etc目录下,rm .pwd.l ...
- django-登录和退出及redis存储session信息
登录 1.视图函数views.py # 登录 from django.contrib.auth import authenticate, login # authenticate:user认证 log ...
- python面试题&练习题之运算符与if控制
1.任意的输入10个数字,按从大到小排序 l2 = [] for i in range(1,11): num = input('输入第{}个数字'.format(i)) if num.isdigit( ...