Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

question: How about add a ResizeObserverProvider? #254

Open
kvii opened this issue Oct 21, 2022 · 0 comments
Open

question: How about add a ResizeObserverProvider? #254

kvii opened this issue Oct 21, 2022 · 0 comments

Comments

@kvii
Copy link

kvii commented Oct 21, 2022

ResizeObserverDelegate.registerHandler can be called multiple time.

registerHandler (el: Element, handler: ResizeHandler): void {
this.elHandlersMap.set(el, handler)
this.observer.observe(el)
}
unregisterHandler (el: Element): void {
if (!this.elHandlersMap.has(el)) {
return
}
this.elHandlersMap.delete(el)
this.observer.unobserve(el)
}
}

And these methods can be used for any file that has been imported the delegate.

import delegate from './delegate'

So, is there need a naive-ui-style api like below?

// App.vue
<NResizeObserverProvider>
    <content />
</NResizeObserverProvider>
// YourComponent.vue
<script setup>
const divRef1 = ref(null)
const divRef2 = ref(null)

const observer = useResizeObserver()
observer.add(divRef1, onResize1)
observer.add(divRef2, onResize2)
</script>

<template>
    <div>
        <div ref="divRef1" />
        <div ref="divRef2" />
    </div>
</template>

So we can use multiple observer at once.

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant