From: Tycho <jh.leong@outlook.com>
Date: Mon, 29 Jul 2024 01:22:18 +0000 (+0800)
Subject: refactor(reactivity): simplify the wrapping logic for returned values in array instru... 
X-Git-Tag: v3.5.0-alpha.5~3
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=e28c58138c4025ae5c907c6fd949cc3cfee1339c;p=thirdparty%2Fvuejs%2Fcore.git

refactor(reactivity): simplify the wrapping logic for returned values in array instrumentations (#11434)
---

diff --git a/packages/reactivity/src/arrayInstrumentations.ts b/packages/reactivity/src/arrayInstrumentations.ts
index f77c5723a0..69f08d6c5d 100644
--- a/packages/reactivity/src/arrayInstrumentations.ts
+++ b/packages/reactivity/src/arrayInstrumentations.ts
@@ -54,16 +54,14 @@ export const arrayInstrumentations: Record<string | symbol, Function> = <any>{
     fn: (item: unknown, index: number, array: unknown[]) => unknown,
     thisArg?: unknown,
   ) {
-    const result = apply(this, 'filter', fn, thisArg)
-    return isProxy(this) && !isShallow(this) ? result.map(toReactive) : result
+    return apply(this, 'filter', fn, thisArg, v => v.map(toReactive))
   },
 
   find(
     fn: (item: unknown, index: number, array: unknown[]) => boolean,
     thisArg?: unknown,
   ) {
-    const result = apply(this, 'find', fn, thisArg)
-    return isProxy(this) && !isShallow(this) ? toReactive(result) : result
+    return apply(this, 'find', fn, thisArg, toReactive)
   },
 
   findIndex(
@@ -77,8 +75,7 @@ export const arrayInstrumentations: Record<string | symbol, Function> = <any>{
     fn: (item: unknown, index: number, array: unknown[]) => boolean,
     thisArg?: unknown,
   ) {
-    const result = apply(this, 'findLast', fn, thisArg)
-    return isProxy(this) && !isShallow(this) ? toReactive(result) : result
+    return apply(this, 'findLast', fn, thisArg, toReactive)
   },
 
   findLastIndex(
@@ -237,11 +234,14 @@ function apply(
   method: ArrayMethods,
   fn: (item: unknown, index: number, array: unknown[]) => unknown,
   thisArg?: unknown,
+  wrappedRetFn?: (result: any) => unknown,
 ) {
   const arr = shallowReadArray(self)
+  let needsWrap = false
   let wrappedFn = fn
   if (arr !== self) {
-    if (!isShallow(self)) {
+    needsWrap = !isShallow(self)
+    if (needsWrap) {
       wrappedFn = function (this: unknown, item, index) {
         return fn.call(this, toReactive(item), index, self)
       }
@@ -252,7 +252,8 @@ function apply(
     }
   }
   // @ts-expect-error our code is limited to es2016 but user code is not
-  return arr[method](wrappedFn, thisArg)
+  const result = arr[method](wrappedFn, thisArg)
+  return needsWrap && wrappedRetFn ? wrappedRetFn(result) : result
 }
 
 // instrument reduce and reduceRight to take ARRAY_ITERATE dependency
diff --git a/packages/runtime-core/src/helpers/renderList.ts b/packages/runtime-core/src/helpers/renderList.ts
index 09f369bf2b..12b0317bdb 100644
--- a/packages/runtime-core/src/helpers/renderList.ts
+++ b/packages/runtime-core/src/helpers/renderList.ts
@@ -60,9 +60,9 @@ export function renderList(
   let ret: VNodeChild[]
   const cached = (cache && cache[index!]) as VNode[] | undefined
   const sourceIsArray = isArray(source)
-  const sourceIsReactiveArray = sourceIsArray && isReactive(source)
 
   if (sourceIsArray || isString(source)) {
+    const sourceIsReactiveArray = sourceIsArray && isReactive(source)
     if (sourceIsReactiveArray) {
       source = shallowReadArray(source)
     }