vuejs / core

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
https://vuejs.org/
MIT License
47.75k stars 8.34k forks source link

fix(reactivity): trigger the ref that is created by toRef from a reactive array #12431

Open noootwo opened 4 days ago

noootwo commented 4 days ago

fix #12427

pkg-pr-new[bot] commented 4 days ago

Open in Stackblitz

@vue/compiler-core

``` pnpm add https://pkg.pr.new/@vue/compiler-core@12431 ```

@vue/compiler-sfc

``` pnpm add https://pkg.pr.new/@vue/compiler-sfc@12431 ```

@vue/compiler-dom

``` pnpm add https://pkg.pr.new/@vue/compiler-dom@12431 ```

@vue/compiler-ssr

``` pnpm add https://pkg.pr.new/@vue/compiler-ssr@12431 ```

@vue/runtime-core

``` pnpm add https://pkg.pr.new/@vue/runtime-core@12431 ```

@vue/reactivity

``` pnpm add https://pkg.pr.new/@vue/reactivity@12431 ```

@vue/runtime-dom

``` pnpm add https://pkg.pr.new/@vue/runtime-dom@12431 ```

@vue/server-renderer

``` pnpm add https://pkg.pr.new/@vue/server-renderer@12431 ```

@vue/shared

``` pnpm add https://pkg.pr.new/@vue/shared@12431 ```

vue

``` pnpm add https://pkg.pr.new/vue@12431 ```

@vue/compat

``` pnpm add https://pkg.pr.new/@vue/compat@12431 ```

commit: eccd16e

github-actions[bot] commented 4 days ago

Size Report

Bundles

File Size Gzip Brotli
runtime-dom.global.prod.js 100 kB (+43 B) 38 kB (+20 B) 34.2 kB (-26 B)
vue.global.prod.js 158 kB (+43 B) 57.8 kB (+21 B) 51.4 kB (-4 B)

Usages

Name Size Gzip Brotli
createApp (CAPI only) 47.2 kB 18.3 kB 16.8 kB
createApp 55.2 kB 21.3 kB 19.5 kB
createSSRApp 59.3 kB 23.1 kB 21 kB
defineCustomElement 60.1 kB 22.9 kB 20.8 kB
overall 69.1 kB 26.5 kB 24.1 kB
edison1105 commented 3 days ago

According to the reproduction in #12427, the issue likely lies within toRef. If source is an array and the key is a number, the key should be converted to a string. However, modifying getDepFromRective broadens the impact scope. Additionally, getDepFromReactive is not a public API, and the test case should ideally use public APIs.

noootwo commented 3 days ago

According to the reproduction in #12427, the issue likely lies within toRef. If source is an array and the key is a number, the key should be converted to a string. However, modifying getDepFromRective broadens the impact scope. Additionally, getDepFromReactive is not a public API, and the test case should ideally use public APIs.

But for getDepFromReactive, it should indeed exhibit such behavior, as it needs to handle this case for all reactive arrays.