//#region ====================== v-resize ======================
const resizeMap = new WeakMap();
const ob = new ResizeObserver((entries) => {
    for (const entry of entries) {
        // 获取dom元素的回调
        const handler = resizeMap.get(entry.target);
        //存在回调函数
        if (handler) {
            // 将监听的值给回调函数
            handler({
                width: entry.borderBoxSize[0].inlineSize,
                height: entry.borderBoxSize[0].blockSize,
            });
        }
    }
});

const resizeDirective = (el, callback) => {
    resizeMap.set(el, callback);
    ob.observe(el);
}

const clearResizeDirective = (el) => {
    ob.unobserve(el);
}
var elementResizeDirective = (app) => {
    app.directive('resize', {
        mounted(el, binding) {
            //将dom与回调的关系塞入map
            resizeMap.set(el, binding.value);
            //监听el元素的变化
            ob.observe(el);
        },
        unmounted(el) {
            //取消监听
            ob.unobserve(el);
        },
    });
};

//#endregion