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

useUpdate

PreviousNext

Memaksa gambar ulang. Di Vue hampir tidak pernah dibutuhkan.

Tidak ada yang perlu dipasang.

Vue sudah menyediakan padanannya — ubah ref-nya; triggerRef() untuk shallowRef. Halaman ini menjelaskan cara memakainya.

Vue menggambar ulang karena datanya berubah, bukan karena disuruh. Kalau tampilan tidak ikut berubah, yang salah hampir selalu bukan ketiadaan pemicu — melainkan datanya memang tidak reaktif.

ts
const hitung = ref(0)
hitung.value += 1   // tampilannya ikut, tanpa diminta

Satu-satunya kasus yang butuh dorongan adalah shallowRef yang isinya diutak-atik di tempat. Reaktivitasnya sengaja dangkal, jadi perubahan di dalamnya memang tidak terlihat:

ts
const daftar = shallowRef([1, 2, 3])

daftar.value.push(4)   // tidak terlihat
triggerRef(daftar)     // baru terlihat

Kalau Anda sering memanggil triggerRef, biasanya shallowRef-nya yang salah pilih — ref biasa akan bekerja sendiri.

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