最近公司有一個專案，使用vue開發微信公眾號，開發過程遇到一個問題，即設計圖的整體背景是白色的，但是公眾號裡預設的背景是淺灰色，如果某個頁面高度沒能佔滿一屏，就會露出淺灰色的預設背景，會顯得很不協調。 使用單純的css沒能解決這個問題，在網上查了些資料也沒發現特別好的方法，最後還是採用了js解決這個問題。

document.documentElement.style.backgroundColor = "#fff";
this.screenH = window.screen.availHeight;
this.pageH = document.documentElement.offsetHeight;
if (this.pageH < this.screenH) {
document.documentElement.style.height = this.screenH + "px";
document.documentElement.scrollTop = '0';
} else {
document.documentElement.style.height = 'auto';
document.documentElement.scrollTop = '0';
}
 

廣州vi設計公司http://www.maiqicn.com 辦公資源網站大全 https://www.wode007.com

思路是，設定網頁背景為白色，比較網頁高度和螢幕高度，如果網頁高度小於螢幕高度，就把網頁高度設成螢幕高度。vue雖然不推薦直接操作DOM，但是在這個問題中，通過操作DOM能夠最簡便的解決問題，所以我覺得，該操作DOM的時候還是要用DOM，不要被“Vue中不推薦操作DOM”這句話侷限了。