kliping.pro
  • Docs
  • Explore
  • Builder
  • Directory
  • Colors
  • Typeset
Saved
Hooks
  • Getting Started2
  • State7
  • Advanced6
  • Lifecycle16
  • useDebounceEffect
  • useDebounceFn
  • useDeepCompareEffect
  • useDeepCompareLayoutEffect
  • useEffectEvent
  • useEffectWithTarget
  • useInterval
  • useIsHydrated
  • useIsomorphicLayoutEffect
  • useMount
  • useThrottleEffect
  • useThrottleFn
  • useTimeout
  • useUnmount
  • useUpdate
  • useUpdateEffect
  • Browser21
  • Development1
  • Third-Party4
  • Libraries4
  1. Hooks
  2. Lifecycle
  3. useUpdate

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 count = ref(0)
count.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 items = shallowRef([1, 2, 3])

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

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

PrevioususeUnmountNext useUpdateEffect

© 2026 Kliping. Free components are open source under the MIT License.

LicenseCreditsRoadmap