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实时监听获取屏幕尺寸大小
基础教程推荐
猜你喜欢
- mysql-在Yii中排序CHtml :: listData下拉列表 2023-10-26
- vue+axios项目开发如何实现伪静态 2025-01-11
- React基础-JSX的本质-虚拟DOM的创建过程实例分析 2023-07-09
- docker-compose中nginx可以访问html无法访问php 提示File not found. ? 2023-10-25
- 使用Ajax模仿百度搜索框的自动提示功能实例 2023-02-22
- Ajax获取回调函数无法赋值给全局变量的问题 2023-02-14
- javascript中的不等于怎么表示 2022-12-13
- 用纯CSS实现禁止鼠标点击事件示例代码 2023-12-21
- 举例详解CSS中的text-shadow文字阴影效果使用 2023-12-20
- CSS中让DIV居中的代码 2023-12-08
