用vue加载footer时，footer应该如何定位？

Question

在不知道其他组件的高度情况下如何可以使footer在页面的尾部？
如果用在首部可以用fixed保证在页面头部，或者absolute也可以。但是页面尾部，在不知道高度的情况下这个组件如何定位或者说显示。
所有在同一个组件的话可以margin-top 但是分组件的话组件内的margin-top是没法根据别的组件计算距离的啊。
求问vue中footer应该如何放置

Answer 1

flex啊大胸弟，网上搜索一下sticky footer，你会豁然开朗

Answer 2

试试给content设置一个最小高度结合sticky-footer

Answer 3

刚好这两天写了一段，这个610是计算footer上面所有的container的高度之和，我这里是一个登陆页，所以能固定610

.footer {

background-color: #f2f3f7; 
padding-top: 50px;
min-height: 150px;
position: relative;

}
.links {

width: 100%;
text-align: center;
position: absolute;
bottom: 50px;

}

<div class="footer">

<div class="links">
  <router-link :to="{path:'/findPw'}" class="foot_link">关于我们</router-link>
</div>

</div>

methods: {

setHeight: function() {
  var height = window.innerHeight - 610;
  if (height > 150) {
    $('.guide .footer').css('height', height);
  }
}

},
mounted: function() {

var that = this;
that.setHeight();
$(window).resize(function() {
  that.setHeight();
});

}