鼠标控制dom元素的大小。采用ResizeObserver——监听元素大小的变化
ResizeObserver是浏览器提供的API，用于替代window.resize事件监听元素尺寸变化，避免性能问题。它能精确观察到Element内容区域或SVGElement边框的变化。在示例中展示了如何在Vue应用中使用ResizeObserver监听div元素的尺寸，并实时更新其内容。同时，需要注意CSS的resize属性需设置为hidden以使功能生效。
这段代码的目的是使用 ResizeObserver 监听一个目标元素的大小变化，并根据目标元素的新尺寸调整 Cesium 画布 (canvas) 的大小。以下是代码的详细解释：
创建 ResizeObserver 实例
const resizeObserver = new ResizeObserver((entries) => {for (let entry of entries) {const target = entry.target;const width = target.clientWidth;const height = target.clientHeight;const cesiumCanvas = document.querySelector(`#${this.cesiumContainer} canvas`);// 设置 Cesium 画布的大小cesiumCanvas.style.width = width + "px";cesiumCanvas.style.height = height + "px";}});
ResizeObserver是一个用于观察元素尺寸变化的 API。- 回调函数接收一个
entries数组，每个entry代表一个被观察的目标元素及其变化。 entry.target是发生变化的元素，clientWidth和clientHeight提供该元素的当前宽度和高度。document.querySelector用于选择特定的canvas元素，并更新其style属性来设置宽度和高度，使其匹配目标元素的尺寸。
选择目标元素并开始观察
// 监听的目标元素const targetElement = document.getElementById(this.cesiumContainer);resizeObserver.observe(targetElement);document.getElementById根据this.cesiumContainer变量的值（应该是一个字符串）选择目标元素。resizeObserver.observe(targetElement)开始观察目标元素的大小变化。
补充：
ResizeObserver.disconnect()
取消特定观察者目标上所有对 Element 的监听。
ResizeObserver.observe()
开始对指定 Element 的监听。
ResizeObserver.unobserve()
结束对指定 Element 的监听。