30 lines
728 B
JavaScript
30 lines
728 B
JavaScript
import { onMounted, onBeforeUnmount } from 'vue'
|
|
|
|
/**
|
|
* Watch for DOM changes on a target element and run a callback.
|
|
*
|
|
* @param {HTMLElement | null} targetElement - Element to monitor
|
|
* @param {Function} callback - Function to run on mutations
|
|
*/
|
|
export function useMutationObserver(targetElement, callback) {
|
|
let observer = null
|
|
|
|
onMounted(() => {
|
|
if (!targetElement) return
|
|
|
|
observer = new MutationObserver((mutations) => {
|
|
mutations.forEach((mutation) => {
|
|
if (mutation.type === 'childList') {
|
|
callback()
|
|
}
|
|
})
|
|
})
|
|
|
|
observer.observe(targetElement, { childList: true, subtree: true })
|
|
})
|
|
|
|
onBeforeUnmount(() => {
|
|
if (observer) observer.disconnect()
|
|
})
|
|
}
|