使用Vuejs获取元素高度

JavaScript

蛋蛋L

2020-03-13

我想获得一个div的高度，以使另一个div匹配它的高度。我使用了clientHeight方法，但是它没有返回好的值（较小的值）。实际上，似乎在所有元素加电之前返回一个高度。在网上进行了一些研究之后，我尝试将window.load（）推迟到一切收费完成之后，但效果不佳。有什么想法吗？

mounted () {
  this.matchHeight()
},
matchHeight () {
  let height = document.getElementById('info-box').clientHeight
}
<div class="columns">
  <div class="left-column" id="context">
  <p>Some text</p>
  </div>
  <div class="right-column" id="info-box">
    <img />
    <ul>
      some list
    </ul>
  </div>
</div>

第1410篇《使用Vuejs获取元素高度》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共1个回答
前端JinJin 2020.03.13

我会使用flexbox实现等高列 https://css-tricks.com/snippets/css/a-guide-to-flexbox/

.container {
   display: flex;
}
.column {
   border: 1px solid;
   padding: 20px;
   width: 150px;
}
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body>
    <div class="container">
        <div class="column">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac dui sed erat venenatis fermentum. Nulla tempus, magna
            sit amet ornare fringilla, ligula quam faucibus urna
        </div>
        <div class="column">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit.
        </div>
    </div>
</body>
</html>

相似问题

0 回答

0 回答

5 回答

25 回答

0 回答

0 回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android