resizeObserver元素监听

resizeObserver是用来提供监测目标元素或者页面刷新的一种观察者工具

1. 当目标元素的 clientwidth/height,offsetWidth/Height, 发生变化，或者页面上有动画或者窗体 resize,都会触发回调函数通知观察者。
2. 观察者有3个方法

• observe 开始观察某个元素，用法 observe(htmlelement).
• unobserve 停止观察某个元素，用法 unobserve(htmlelement).
• disconnect 停止观察所有的元素.

例子：

const resizeObserver = new ResizeObserver((entries, observer) => {
    console.log(entries.length, observer)
    entries.forEach((item, index) => {
        console.log(item.contentRect, index)
    })
})
onMounted(() => {
    resizeObserver.observe(document.querySelector('#btd-main-container'))
})
onUnmounted(() => {
    resizeObserver.unobserve(document.querySelector('#btd-main-container'))
})