vuejs / pinia

🍍 Intuitive, type safe, light and flexible Store for Vue using the composition api with DevTools support
https://pinia.vuejs.org
MIT License
13.02k stars 1.04k forks source link

In Pinia, the `watch` function fails to capture changes to object properties within the `state`. #2651

Closed HXHSHR closed 5 months ago

HXHSHR commented 5 months ago

Reproduction

In Pinia, when an array is wrapped with ref and watched for changes using watch, modifications made to the array using built-in methods like push are not being detected by the watcher.

Steps to reproduce the bug

image image

Expected behavior

Based on my understanding, when the value of arr is changed, the watch function can detect its changes. If the value of arr is directly modified, for example, store.arr = ['1'], this change will be detected by watch. However, if reactive is used instead of ref, the test results are the opposite: direct changes to the value of arr will not be detected, but modifications made with methods like push or unshift will be detected.

Actual behavior

Based on my understanding, when the value of arr is changed, the watch function can detect its changes. If the value of arr is directly modified, for example, store.arr = ['1'], this change will be detected by watch. However, if reactive is used instead of ref, the test results are the opposite: direct changes to the value of arr will not be detected, but modifications made with methods like push or unshift will be detected.

Additional information

No response