获取dom的id属性
index.ts
import { onMounted } from "vue"
type option = {
el: string
}
export default function(option:option):Promise<{name: string}> {
return new Promise((resolve)=>{
onMounted(()=>{
const dom:HTMLElement = document.querySelector(option.el) as HTMLDivElement;
resolve({name: dom.id})
})
})
}
使用
<template>
<div class="ad"></div>
</template>
<script setup lang="ts">
//hooks 的工具库 vueuse
import getId from './hooks/index';
getId({
el: '.ad'
}).then(res => {
console.log(res);
})
</script>
获取dom的大小
function useResize(el: HTMLElement, callback: (cr: DOMRectReadOnly, resize: ResizeObserver) => void) {
let resize: ResizeObserver
resize = new ResizeObserver((entries) => {
for (let entry of entries) {
const cr = entry.contentRect;
callback(cr, resize)
}
});
resize.observe(el)
}
export default useResize
使用
onMounted(() => {
useResize(document.querySelector('#ad') as HTMLElement, (e) => {
console.log(e);
})
})