一、获取屏幕高度赋值给div

html:

<div id="industrySectorScroll" :style="{ height: screenHeight + 'px' }"></div>

js:

  export default {
    name: "industrySectorScroll",

    data() {
      return {
        screenWeight: 0, // 屏幕宽度
        screenHeight: 0, // 屏幕高度
   
      };
    },
    mounted() {
      this.screenWeight = document.documentElement.clientWidth;
      this.screenHeight = document.documentElement.clientHeight;
}

二、根据class类名获取div高度

html:

获取高度的div

<div class="canvasWrap>要填充内容才有高度,或者写死高度</div>

被赋值的div

<div id="industrySectorScroll" :style="{ height: screenHeight + 'px' }"></div>

js:

 

  export default {
    name: "industrySectorScroll",

    data() {
      return {
        screenWeight: 0, // 屏幕宽度
        screenHeight: 0, // 屏幕高度
   
      };
    },
    mounted() {
      this.screenWeight =  document.querySelector(`.canvasWrap`).clientWidth;
      this.screenHeight = document.querySelector(`.canvasWrap`).clientHeight;
}

Logo

Vue社区为您提供最前沿的新闻资讯和知识内容

更多推荐