基于vue解决100vw和100vh出现滚动条的问题

width：100vw和height:100vh出现滚动条的原因在于

% 是相对于父元素的大小设定的比率，vw、vh 是视窗大小决定的。

window.innerWidth = 视口宽度 = 100vw // 打印1280

this.$refs.main.clientWidth = 父视图宽度(body宽度) = 100% // 打印1263

所以视口宽度其实是包含了滚动条的宽度

解决办法：

html,body,#app{

    margin: 0;

    padding: 0;

    height: 100%;

}

设置全局样式表并在main.js中引入 

import "./assets/css/common.css";

 

注意：vue开发移动端不会出现此问题

RLLM->Remeber less, learn morn