-
-
Notifications
You must be signed in to change notification settings - Fork 8.8k
Open
Labels
🔨 p3-minor-bugPriority 3: this fixes a bug, but is an edge case that only affects very specific usage.Priority 3: this fixes a bug, but is an edge case that only affects very specific usage.has workaroundA workaround has been found to avoid the problemA workaround has been found to avoid the problemscope: reactivity
Description
Vue version
3.5.6
Link to minimal reproduction
Steps to reproduce
const form = reactive({ user: { email: ['a@a.com', 'b@b.com'] } });
const emailNumberRef = toRef(form.user.email, 0);
watchEffect(() => {
console.log(emailNumberRef.value);
});
triggerRef(emailNumberRef); // <-- FAILS
/*
@vue/reactivity/dist/reactivity.cjs.js:1487
ref2.dep.trigger({
^
TypeError: Cannot read properties of undefined (reading 'trigger')
*/
const emailStringRef = toRef(form.user.email, '1'); // <-- TS is not happy
watchEffect(() => {
console.log(emailStringRef.value);
});
triggerRef(emailStringRef); // <-- WORKS FINE
On The SFC playground it fails silently. No effect is called for number prop, but it works fine for string prop
What is expected?
triggerRef
triggers effects for a reference with an integer key
What is actually happening?
triggerRef
fails on a reference with an integer key
System Info
System:
OS: macOS 14.4.1
CPU: (8) arm64 Apple M1
Memory: 66.09 MB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 20.12.2 - ~/.nvm/versions/node/v20.12.2/bin/node
npm: 10.5.0 - ~/.nvm/versions/node/v20.12.2/bin/npm
pnpm: 9.10.0 - ~/.nvm/versions/node/v20.12.2/bin/pnpm
Browsers:
Chrome: 130.0.6723.117
Safari: 17.4.1
Any additional comments?
it happens because Proxy index gets converted to string.
So, here
core/packages/reactivity/src/baseHandlers.ts
Line 113 in 14f6917
track(target, TrackOpTypes.GET, key) |
core/packages/reactivity/src/dep.ts
Line 389 in 14f6917
const depMap = targetMap.get(object) |
Consider converting string key to number for arrays when tracking
Metadata
Metadata
Assignees
Labels
🔨 p3-minor-bugPriority 3: this fixes a bug, but is an edge case that only affects very specific usage.Priority 3: this fixes a bug, but is an edge case that only affects very specific usage.has workaroundA workaround has been found to avoid the problemA workaround has been found to avoid the problemscope: reactivity