vuejs监听当前浏览器大小执行


data(){
   return {
     screenWidth: document.body.clientWidth
   }
},
mounted() {
    //监听浏览器大小
    let that = this;
    window.addEventListener("resize", function() {
      return (() => {
        window.screenWidth = document.body.clientWidth;
        that.screenWidth = window.screenWidth;
        console.log("that.screenWidth", that.screenWidth);
      })();
    });
},
watch: {
    //防止因为频繁触发 resize 函数,导致页面很卡的问题
    screenWidth(val) {
      if (!this.timer) {
        this.screenWidth = val;
        this.timer = true;
        let that = this;
        setTimeout(function() {
          that.reload();
          that.timer = false;
        }, 400);
      }
    }
}
以上是编程学习网小编为您介绍的“vuejs监听当前浏览器大小执行”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。

本文标题为:vuejs监听当前浏览器大小执行

基础教程推荐