js/vue 动态获取浏览器宽度/高度
data() {return {windowWidth: document.documentElement.clientWidth, // 实时屏幕宽度windowHeight: document.documentElement.clientHeight // 实时屏幕高度}},mounted() {// 实时获取浏览器宽度高度const that = thiswindow.onresize =
·
动态获取浏览器大小,可以动态调整页面布局,让页面更加灵活。
JS获取浏览器高度:
var width=document.documentElement.clientWidth;
var height=document.documentElement.clientHeight;
//原生JS动态获取浏览器大小改变使用onresize:
window.onresize = function(){
alert(document.documentElement.clientWidth);
alert(document.documentElement.clientHeight);
}
Vue组件中动态获取高度,使用如下方式
data() {
return {
windowWidth: document.documentElement.clientWidth, // 实时屏幕宽度
windowHeight: document.documentElement.clientHeight // 实时屏幕高度
}
},
mounted() {
// 实时获取浏览器宽度高度
const that = this
window.onresize = () => {
return (() => {
window.fullHeight = document.documentElement.clientHeight
window.fullWidth = document.documentElement.clientWidth
that.windowHeight = window.fullHeight // 高
that.windowWidth = window.fullWidth // 宽
})()
}
},
更多推荐
已为社区贡献5条内容
所有评论(0)