kliping.pro
  • Docs
  • Directory
  • Colors
  • Typeset
Hooks
  • State7
  • Advanced6
  • Lifecycle16
    • useDebounceEffect
    • useDebounceFn
    • useDeepCompareEffect
    • useDeepCompareLayoutEffect
    • useEffectEvent
    • useEffectWithTarget
    • useInterval
    • useIsHydrated
    • useIsomorphicLayoutEffect
    • useMount
    • useThrottleEffect
    • useThrottleFn
    • useTimeout
    • useUnmount
    • useUpdate
    • useUpdateEffect
  • Browser21
  • Development1
  • Third-Party4
  • Libraries4

useDeepCompareLayoutEffect

PreviousNext

Perubahan isi objek yang ditangani sebelum peramban 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.

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