Kliping
KlipingBerandaDokumentasiKomponenBlocksVariasiTemplateDice UIHooks
Memulai
  • Pengenalan
  • Instalasi
  • Kredit
State
  • useBoolean
  • useControllableValue
  • useCounter
  • useDebounce
  • useResetState
  • useThrottle
  • useToggle
Lanjutan
  • useCreation
  • useCustomCompareEffect
  • useLatest
  • useLockFn
  • useMemoizedFn
  • usePrevious
Siklus Hidup
  • useDebounceEffect
  • useDebounceFn
  • useDeepCompareEffect
  • useDeepCompareLayoutEffect
  • useEffectEvent
  • useEffectWithTarget
  • useInterval
  • useIsHydrated
  • useIsomorphicLayoutEffect
  • useMount
  • useThrottleEffect
  • useThrottleFn
  • useTimeout
  • useUnmount
  • useUpdate
  • useUpdateEffect
Peramban
  • useActiveElement
  • useBattery
  • useClickAnyWhere
  • useClickAway
  • useClipboard
  • useDocumentVisibility
  • useElementSize
  • useEventListener
  • useFps
  • useFullscreen
  • useHash
  • useHover
  • useInViewport
  • useIsMatchMedia
  • useIsOnline
  • useMouse
  • useNetwork
  • useOs
  • useScrollLock
  • useTextSelection
  • useTitle
Pengembangan
  • useWhyDidYouUpdate
Paket Luar
  • useMcp
  • useQuery
  • useStickToBottom
  • useSwr
Pustaka
  • isBrowser
  • createContext
  • bacaElemen
  • saatTerpasang

useDeepCompareLayoutEffect

SebelumnyaBerikutnya

Perubahan isi objek yang ditangani sebelum peramban menggambar.

Urutan jalan: —

flush: 'sync' berjalan seketika, sebelum Vue sempat menggambar.

Tidak ada yang perlu dipasang.

Vue sudah menyediakan padanannya — watch(src, cb, { deep: true, flush: 'sync' }). Halaman ini menjelaskan cara memakainya.

ts
watch(kotak, sesuaikanPosisi, { deep: true, flush: 'sync' })

flush menentukan kapan callback-nya berjalan, dan Vue punya tiga:

flushKapan
'pre'sebelum komponennya digambar ulang — bawaan
'post'sesudah DOM-nya diperbarui — untuk mengukur
'sync'seketika saat sumbernya berubah

Pakai 'sync' hanya kalau memang perlu. Pekerjaan sinkron di jalur ini menahan pembaruan berikutnya, dan untuk sebagian besar penyesuaian tata letak, 'post' justru yang benar — di sana DOM-nya sudah ada dan bisa diukur.

useDeepCompareEffectuseEffectEvent
Dirilis di bawah lisensi MIT. Ditulis ulang untuk Vue dari shadcn-vue, shadcn-ui-blocks, dan shadcn-hooks. Hak cipta © 2026 Kliping