🌐 AI搜索 & 代理 主页
Skip to content

BUG | refManualReset | Does not track deep mutations #5200

@xiaoland

Description

@xiaoland

Describe the bug

refManualReset() is implemented using customRef.
Because customRef only tracks access through its get() and triggers updates only when set() is called, deep mutations inside the stored object are never tracked.

Reproduction

https://playground.vueuse.org/#eNp9U01v2zAM/SuELknQxMawHYbMLZoNPXTA2mHLbrpoMu0olSVDH0mGwP99lO2kQVHkYkvkI/X49HRkq7bNdhHZkhVeOtUG8BhiC1qY+paz4Dm740Y1rXUBjuCw+iFMFPoXEg46qJxtYHJPLaLHXFqHE264kdb4AJV1Ddy+KZoeuQEgtFtCvwQwosElcLa2DWfzIdY6WylN4SOImn4fPkOXMvTpZl/SGXkO643y4KLxc/gbA/x5hL3SGp6e1xDbUgSE/QZNagByQxOh56aKRgZlDSgjHQqPqxqns4FKIpzthI6YJYLZSCKjBjc3CZDmshTQtp5OXtuWy8n8WvGMSHNT5IPEJChtAjatJoq0AyhKtQOphfckeqXxAOmzkFaDIqBfSDQBHWyjD6r6d9ruF9QRacLNuOhvK8mXGt7RZKTfsSf2llLXFXnCjHCSL5Am91Ir+UIcLsShnquyTCIW+QAbKI/lRX4xCZuTZUikStXZ1ltDvuqF5UzapqWj3XObxCdbnW+fM6G13X/vY8FFHB1ANRuUL+/Et/6QYpz9dOQotyOK51wQrsYwpB9+P+GB1udkY8uoCX0lSR61OiaOA+xrNCXRvsD1bB/7F6FMvfYPh4DGn4ZKRHuf9njO6GV8uzL6K92P2aeTv1n3HyhOOGg=

💡 Expected behavior

In fact, I'm not asking for a change to the implementation, since user can solve this simply by add reactive to the defaultValue.

Instead, I propose adding a clear documentation note:

  • refManualReset() is shallow.
  • Deep mutations inside the object will not trigger reactive updates unless the object itself is wrapped with reactive().
  • Only calling set() triggers updates — internal mutations do not.

This is especially important because ref() sometimes appears to react to deep mutations in templates due to unwrapping + dependency tracking, which makes refManualReset() ’s behavior look inconsistent if developers are unaware of customRef limitations.

Suggested documentation note:

Note:

refManualReset() uses customRef, which does not provide deep reactivity.
Only assignments to the ref itself (ref.value = ...) trigger updates.
Mutating nested properties (ref.value.foo.bar = ...) will not trigger updates unless the internal value is made reactive manually (e.g., reactive()).

📌 Why this matters

refManualReset() is really useful in form states and similar contexts where users naturally expect deep mutations to be reactive.
Clarifying this behavior will prevent misuse and confusion.

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 AMD Ryzen 5 3600 6-Core Processor
    Memory: 7.25 GB / 31.95 GB
  Binaries:
    Node: 20.19.6 - C:\nvm4w\nodejs\node.EXE
    npm: 10.8.2 - C:\nvm4w\nodejs\npm.CMD
    pnpm: 10.22.0 - C:\Users\yyh\AppData\Local\pnpm\pnpm.CMD
  Browsers:
    Edge: Chromium (142.0.3595.80)
    Internet Explorer: 11.0.19041.5794
  npmPackages:
    @vueuse/core: ^14.0.0 => 14.0.0
    vue: ^3.5.18 => 3.5.25

Used Package Manager

pnpm

Validations

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions