Github
Twitter
Discord
Playground
Search…
English
👋
Atomico
🚀
Getting started with Atomico
Api
🧬
Props(Properties)
🧩
VirtualDOM
🎣
Hooks
🔬
Testing
Guides
🧠
Atomico design patterns
🗺
Atomico style guide
🛡
Atomico with Typescript
🤝
Atomico and React
🔀
Slot
🗃
Archives
@atomico
@atomico/store
@atomico/design-tokens
@atomico/router
@atomico/react
@atomico/hooks
use-ref-values
use-script
use-attributes
use-prop-proxy
use-click-press
use-dollars
use-reflect-event
use-keyboar
use-click-coordinates
use-copy
use-debounce-state
use-form
use-listener
use-disabled
use-css
use-channel
use-promise
use-responsive-state
use-parent
use-resize-observer
use-slot
use-render
use-mutation-observer
use-css-light-dom
use-controller
use-router
use-async-effect
use-child-nodes
use-force-render
@atomico/components
@atomico/exports
@atomico/magic-form
Support
Discord
Github
Twitter
Powered By
GitBook
use-mutation-observer
Observe the changes of a reference using MutationObserver
Module
1
import
{
2
useMutationObserver
,
3
useMutationObserverState
4
}
from
"@atomico/hooks/use-mutation-observer"
;
Copied!
useMutationObserver syntax
Observe mutations using a callback
1
useMutationObserver
(
2
ref
:
Ref
<
Element
>
,
3
observe
:
MutationCallback
,
4
config
?:
MutationObserverInit
5
);
Copied!
useMutationObserver syntax
Reflects mutations in a state
1
const
mutations
:
MutationRecord
[]
=
useMutationObserverState
(
2
ref
:
Ref
<
Element
>
,
3
config
?:
MutationObserverInit
4
);
Copied!
Example
WebComponents.dev
WebComponents.dev
Previous
use-render
Next
use-css-light-dom
Last modified
2mo ago
Copy link
Edit on GitHub
Contents
Module
useMutationObserver syntax
useMutationObserver syntax
Example