From 09b44e07cbfd75f34e26e3ffee6a06a200acda88 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Tue, 14 Apr 2020 22:18:58 -0400
Subject: [PATCH] refactor(reactivity): move array ref handling into getter

---
 packages/reactivity/src/baseHandlers.ts | 31 +++++++++++++++----------
 packages/reactivity/src/reactive.ts     |  5 +---
 2 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/packages/reactivity/src/baseHandlers.ts b/packages/reactivity/src/baseHandlers.ts
index 4d5ec50f..8cda6d76 100644
--- a/packages/reactivity/src/baseHandlers.ts
+++ b/packages/reactivity/src/baseHandlers.ts
@@ -36,7 +36,8 @@ const arrayInstrumentations: Record<string, Function> = {}
 
 function createGetter(isReadonly = false, shallow = false) {
   return function get(target: object, key: string | symbol, receiver: object) {
-    if (isArray(target) && hasOwn(arrayInstrumentations, key)) {
+    const targetIsArray = isArray(target)
+    if (targetIsArray && hasOwn(arrayInstrumentations, key)) {
       return Reflect.get(arrayInstrumentations, key, receiver)
     }
     const res = Reflect.get(target, key, receiver)
@@ -48,18 +49,24 @@ function createGetter(isReadonly = false, shallow = false) {
       // TODO strict mode that returns a shallow-readonly version of the value
       return res
     }
-    // ref unwrapping, only for Objects, not for Arrays.
-    if (isRef(res) && !isArray(target)) {
-      return res.value
+    if (isRef(res)) {
+      if (targetIsArray) {
+        track(target, TrackOpTypes.GET, key)
+        return res
+      } else {
+        // ref unwrapping, only for Objects, not for Arrays.
+        return res.value
+      }
+    } else {
+      track(target, TrackOpTypes.GET, key)
+      return isObject(res)
+        ? isReadonly
+          ? // need to lazy access readonly and reactive here to avoid
+            // circular dependency
+            readonly(res)
+          : reactive(res)
+        : res
     }
-    track(target, TrackOpTypes.GET, key)
-    return isObject(res)
-      ? isReadonly
-        ? // need to lazy access readonly and reactive here to avoid
-          // circular dependency
-          readonly(res)
-        : reactive(res)
-      : res
   }
 }
 
diff --git a/packages/reactivity/src/reactive.ts b/packages/reactivity/src/reactive.ts
index d6f9c67a..8ec53aff 100644
--- a/packages/reactivity/src/reactive.ts
+++ b/packages/reactivity/src/reactive.ts
@@ -9,7 +9,7 @@ import {
   mutableCollectionHandlers,
   readonlyCollectionHandlers
 } from './collectionHandlers'
-import { UnwrapRef, Ref, isRef } from './ref'
+import { UnwrapRef, Ref } from './ref'
 import { makeMap } from '@vue/shared'
 
 // WeakMaps that store {raw <-> observed} pairs.
@@ -46,9 +46,6 @@ export function reactive(target: object) {
   if (readonlyToRaw.has(target)) {
     return target
   }
-  if (isRef(target)) {
-    return target
-  }
   return createReactiveObject(
     target,
     rawToReactive,