前言
有时页面需要根据浏览器宽高进行样式或逻辑的变化，这时候就需要 实时 获取浏览器窗口宽高。
解决方案在生命周期钩子函数 mounted() 中通过 document.body.clientWidth | document.body.clientHeight 获取浏览器宽高，然后通过 window.onresize 监听浏览器窗口变化，当变化时修改 data() 变量来实现。
当前宽度: {
{ screenWidth }}
关注
打赏
![]()
1688896170
查看更多评论
热门博文
- uni-app - 随机数生成器，随机生成指定区间的整数或小数（支持指定小数点的位数）
- uni-app - 节流与防抖（按钮节流、输入框防抖解决方案）
- 微信小程序 - 页面触底 onReachBottom() 懒加载自动计算分页、检查是否已经请求完全部数据、自动请求接口合并数据（高效自动判断分页懒加载是否继续请求接口数据，超详细触底请求后端示例教程）
- JavaScript - 简单快速，根据条件剔除删除对象中某个字段键值（key / value）
- 微信小程序 - wx.navigateTo 跳转的路径携带 query 等参数，直接被忽略截断了（只剩网页域名后面的参数都没了），导致无法顺利传递给 web-view 组件（解决方案）
- JavaScript - 判断当前网页是否在微信内置浏览器中运行（最靠谱的方案，检查是否在微信浏览器中打开网站或页面）
- JavaScript - 纯 JS 实现让浏览器滚动条回到顶部（3种解决方案）
- uni-app - 根据后端返回的唯一 ID / code，生成 “唯一“ 的推荐码、邀请码、订单号、加密路由、一串英文+数字长字符等 （支持反序列化原 ID 解码，逆向得出 ID 二者互转）
- Vue Nuxt.js - 根据后端返回的唯一 ID / code，生成 “唯一“ 的推荐码、邀请码、订单号、加密路由、一串英文+数字长字符等 （支持反序列化原 ID 解码，逆向得出 ID 二者互转）
- JavaScript - 根据后端返回的唯一 ID / code，生成 “唯一“ 的推荐码、邀请码、订单号、加密路由、一串英文+数字长字符等 （支持反序列化原 ID 解码，逆向得出 ID 二者互转）
