本篇內容主要講解“vue怎么獲取屏幕的寬度”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“vue怎么獲取屏幕的寬度”吧!

創(chuàng)新互聯(lián)建站專注于勉縣網(wǎng)站建設服務及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供勉縣營銷型網(wǎng)站建設，勉縣網(wǎng)站制作、勉縣網(wǎng)頁設計、勉縣網(wǎng)站官網(wǎng)定制、微信平臺小程序開發(fā)服務，打造勉縣網(wǎng)絡公司原創(chuàng)品牌,更為您提供勉縣網(wǎng)站排名全網(wǎng)營銷落地服務。

具體方法如下：

1.使用document.documentElement方法獲取屏幕的寬高

windowWidth: document.documentElement.clientWidth, //獲取屏幕寬度
windowHeight: document.documentElement.clientHeight, //獲取屏幕高度

2.在watch中實時監(jiān)聽屏幕寬高

watch: {
windowHeight (val) {
let that = this;
console.log("實時屏幕高度：",val, that.windowHeight );
},
windowWidth (val) {
let that = this;
console.log("實時屏幕寬度：",val, that.windowHeight );
}
},

3.使用mounted函數(shù)獲取屏幕寬高

mounted() {
var that = this;
window.onresize = () => {
return (() => {
window.fullHeight = document.documentElement.clientHeight;
window.fullWidth = document.documentElement.clientWidth;
that.windowHeight = window.fullHeight; //獲取屏幕高度
that.windowWidth = window.fullWidth; //獲取屏幕寬度
})()
};
},

到此，相信大家對“vue怎么獲取屏幕的寬度”有了更深的了解，不妨來實際操作一番吧！這里是創(chuàng)新互聯(lián)網(wǎng)站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續(xù)學習！