data中
widthPlay: 0, //元素宽
heightPlay: 0, //元素高
observer: null
mounted中监听
let ResizeObserver = window.ResizeObserver || window.WebKitResizeObserver || window.MozResizeObserver;
this.observer = new ResizeObserver(() => {
let widthPlay = document.querySelector('.player').style.width
//this.$refs['cost-echarts'].clientWidth替换更好
let heightPlay = document.querySelector('.player').style.height
if (this.widthPlay != widthPlay || this.heightPlay != heightPlay) {
//everything
}
});
this.observer.observe(document.querySelector('.player'), {
attributes: true,
attributeFilter: ['style'],
attributeOldValue: true
})
//this.observer.observe(document.querySelector('.player'))
beforeDestroy时取消
if (this.observer) {
this.observer.disconnect()
this.observer = null
}
搞定