vue监听游览器高度变化做内容自适应
data() {
setHeight: 500,
browserHeight : 500
},
mounted() {
// 进入页面时监听游览器高度变化
window.addEventListener('resize', this.getHeight)
},
watch: {
browserHeight: {
// 游览器高度变化时,动态设置高度
handler(nv) {
this.setHeight = nv - 400 > 300 ? JSON.stringify(nv - 400) : '300'
}
}
},
methods: {
getHeight() {
// 获取浏览器高度
this.browserHeight = window.innerHeight
}
},
beforeRouteLeave(to, from, next) {
// 离开页面时取消监听
window.removeEventListener('resize', this.getHeight)
next()
}