https://blog.csdn.net/aithena/article/details/103251010?utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromMachineLearnPai2%7Edefault-2.control&dist_request_id=&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromMachineLearnPai2%7Edefault-2.control

//设置el-table宽度 获取table的宽度、设置高度 

<el-table
      :style="{ width: tableWidth }"
      :height="tableHeight"
      :max-height="maxTableHeight"
    >


:style="'width:'+dataWidths+'px'"
this.tableWidth = "64%";
this.tableHeight = this.screenHeight - 260

let dataWidth = this.$refs.element.offsetWidth;//offsetHeight

Vue获取元素高度.

<div ref="element"></div> 

let titles = document.getElementsByClassName("nav-title");
let footer = document.querySelector(".pagefooter").offsetTop;
let divHeight = document.getElementById("div").clientWidth  // clientHeight
//vm.$el获取Vue实例关联的DOM元素;
let scrollview = this.$el.querySelector("#scrollview");

this.$nextTick(() => {
  console.log(this.$refs.element.offsetHight);
})
:style="'width:'+dataWidths+'px'"

let dataWidth = this.$refs.element.offsetWidth;//offsetHeight
    // 获取浏览器可视区域高度
    this.clientWidth = `${document.documentElement.clientWidth}`;
    this.clientHeight = `${document.documentElement.clientHeight}`;
    console.log(this.clientWidth)

// 获取高度值 (内容高+padding+边框)

let height= this.$refs.element.offsetHeight;  //100 offsetWidth

// 获取元素样式值 (存在单位)

let height = window.getComputedStyle(this.$refs.element).height; // 100px width

//获取元素内联样式值(非内联样式无法获取)

let height = this.$refs.element.style.height; // 100px width

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐