vue如何实时监听当前浏览器分辨率大小,根据不同分辨率执行不同操作,下面编程教程网小编给大家简单介绍一下具体实现代码!
具体代码如下:
data(){
return{
screenWidth: null,
}
},
mounted() {
this.screenWidth = document.body.clientWidth
window.onresize = () => {
return (() => {
this.screenWidth = document.body.clientWidth
})()
}
},
watch: {
screenWidth: {
handler: function (val) {
if (val < 1024) {
console.log(val + '屏幕宽度不能小于1024')
} else {
console.log(val + '屏幕宽度属于正常状态')
}
}
},
}
以上是编程学习网小编为您介绍的“vue实时监听获取屏幕尺寸大小”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vue实时监听获取屏幕尺寸大小
基础教程推荐
猜你喜欢
- apply和call方法定义及apply和call方法的区别 2024-01-07
- layui自定义组件根据id获取id内的form值 2023-08-31
- vue 请求拦截request将token添加到请求头headers 2023-10-08
- el-dialog中获取el-table组件的ref值报undefined错误! 2025-01-17
- EasySlider 基于jQuery功能强大简单易用的滑动门插件 2024-03-31
- CSS实现照片堆叠效果的实例代码 2024-01-21
- JS错误之:Uncaught ReferenceError: $ is not defined 2022-12-09
- js实现扫雷源代码 2024-03-11
- HTML中table表格拆分合并(colspan、rowspan) 2022-09-20
- 解决JS浮点数运算出现Bug的方法 2023-12-02