vue项目如何监听窗口变化，达到页面自适应？

vue项目如何监听窗口变化，达到页面自适应？
使用方法：
获取窗口宽度：document.body.clientWidth
监听窗口变化：window.onresize

JS里这些方法：
网页可见区域宽：document.body.clientWidth
网页可见区域高：document.body.clientHeight
网页可见区域宽：document.body.offsetWidth (包括边线的宽)
网页可见区域高：document.body.offsetHeight (包括边线的宽)

用法：
1、我们将document.body.clientWidth赋值给data中自定义的变量：
data:{
screenWidth: document.body.clientWidth
}

2、在页面mounted时，挂载window.onresize方法：

mounted () {
const that = this
window.onresize = () => {
return (() => {
window.screenWidth = document.body.clientWidth
that.screenWidth = window.screenWidth
})()
}
}

3、监听screenWidth属性值的变化&#