Vue里如何通过js设置body的高度等于window的高度？

我知道应该在mounted里写

$('body').css({'height':$(window).height()});

但是原生应该如何实现？

vue.js javascript

阅读 14.1k

4 个回答

难道你们都忽略了一个css属性
直接设置：

body{
  height:100vh;
}

至于vh:100vh就等于当前视窗的高度，同样的还有vw

阚巍巍

1644

发布于
2017-09-26

这个和vue框架没关系，是css的问题。

<html>
    <body>
        <div class="app"></div>
    </body>
</html>
<style>
    html,body {
        width: 100%;
        height: 100%;
    }
</style>

陌路凡歌

7.9k21119

发布于
2017-09-26

更新于
2017-09-26

css里，html,body{height:100%}
js的话

 var doc = document.documentElement;
    document.body.style.height =  doc.scrollHeight+'px';

Leon

2k1617

发布于
2017-09-26

js获取窗口大小:
document.documentElement.clientWidth ==> 可见区域宽度
高度同理。
然后在created或mounted方法调用就行

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进

推荐问题

相似问题

找不到问题？创建新问题

Vue里如何通过js设置body的高度等于window的高度？

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

Next.js做纯前端是否可行？

如何在Vue中点击菜单弹出v-dialog对话框？

如何用Vue实现Word文档自动分页与双页排版功能？

如何实现一个深拷贝函数？

为什么 el-tabl操作列加了 fixed="right"之后列边框线不完整，有大佬知道原因吗？

git提交记录问题？

Vue里如何通过js设置body的高度等于window的高度？

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

Next.js做纯前端是否可行？

如何在Vue中点击菜单弹出v-dialog对话框？

如何用Vue实现Word文档自动分页与双页排版功能？

如何实现一个深拷贝函数？

为什么 el-tabl操作列加了 fixed="right"之后 列边框线不完整，有大佬知道原因吗？

git提交记录问题？

为什么 el-tabl操作列加了 fixed="right"之后列边框线不完整，有大佬知道原因吗？