From b9fab71aadee6f4ed4ef9c0dd323c64dbfd7ed92 Mon Sep 17 00:00:00 2001
From: Anthony Fu <anthonyfu117@hotmail.com>
Date: Mon, 22 Jun 2020 01:00:43 +0800
Subject: [PATCH] revert: #387 (#395)

* Revert "fix: unwrap refs returned by `data` (#387)"

This reverts commit 1f0707548652b5a69cc307060976fe54cba025cb.

* docs: add limitation note for reactive apis in data()

Co-authored-by: Carlos Rodrigues <david-181@hotmail.com>
---
 README.md          | 15 +++++++++++++++
 src/setup.ts       | 28 ++++++++++++----------------
 test/setup.spec.js | 46 ----------------------------------------------
 3 files changed, 27 insertions(+), 62 deletions(-)

diff --git a/README.md b/README.md
index 5af16bab..a7a3717c 100644
--- a/README.md
+++ b/README.md
@@ -315,6 +315,21 @@ declare module '@vue/composition-api/dist/component/component' {
 }
 ```
 
+### :x: Reactive APIs in `data()`
+
+Passing `ref`, `reactive` or other reactive apis to `data()` would not work.
+
+```jsx
+export default {
+  data() {
+    return {
+      // will result { a: { value: 1 } } in template
+      a: ref(1) 
+    }
+  },
+};
+```
+
 ## SSR
 
 Even if there is no definitive Vue 3 API for SSR yet, this plugin implements the `onServerPrefetch` lifecycle hook that allows you to use the `serverPrefetch` hook found in the classic API.
diff --git a/src/setup.ts b/src/setup.ts
index bcb93b7d..b1a40ae2 100644
--- a/src/setup.ts
+++ b/src/setup.ts
@@ -154,22 +154,6 @@ export function mixin(Vue: VueConstructor) {
       }
     }
 
-    const { data } = $options
-    // wrapper the data option, so we can invoke setup before data get resolved
-    $options.data = function wrappedData() {
-      if (setup) {
-        initSetup(vm, vm.$props)
-      }
-      const dataValue =
-        typeof data === 'function'
-          ? (data as (
-              this: ComponentInstance,
-              x: ComponentInstance
-            ) => object).call(vm, vm)
-          : data || {}
-      return unwrapRefProxy(dataValue)
-    }
-
     if (!setup) {
       return
     }
@@ -182,6 +166,18 @@ export function mixin(Vue: VueConstructor) {
       }
       return
     }
+
+    const { data } = $options
+    // wrapper the data option, so we can invoke setup before data get resolved
+    $options.data = function wrappedData() {
+      initSetup(vm, vm.$props)
+      return typeof data === 'function'
+        ? (data as (
+            this: ComponentInstance,
+            x: ComponentInstance
+          ) => object).call(vm, vm)
+        : data || {}
+    }
   }
 
   function initSetup(vm: ComponentInstance, props: Record<any, any> = {}) {
diff --git a/test/setup.spec.js b/test/setup.spec.js
index 5d0ad820..497f8bb6 100644
--- a/test/setup.spec.js
+++ b/test/setup.spec.js
@@ -84,19 +84,6 @@ describe('setup', () => {
     expect(vm.b).toBe(1)
   })
 
-  // #385
-  it('should unwrapRef on data', () => {
-    const vm = new Vue({
-      data() {
-        return {
-          a: ref(1),
-        }
-      },
-      setup() {},
-    }).$mount()
-    expect(vm.a).toBe(1)
-  })
-
   it('should work with `methods` and `data` options', (done) => {
     let calls = 0
     const vm = new Vue({
@@ -769,37 +756,4 @@ describe('setup', () => {
     const vm = new Vue(Constructor).$mount()
     expect(vm.$el.textContent).toBe('Composition-api')
   })
-
-  it('should keep data reactive', async () => {
-    const vm = new Vue({
-      template: `<div>
-        <button id="a" @click="a++">{{a}}</button>
-        <button id="b" @click="b++">{{b}}</button>
-      </div>`,
-      data() {
-        return {
-          a: 1,
-          b: ref(1),
-        }
-      },
-    }).$mount()
-
-    const a = vm.$el.querySelector('#a')
-    const b = vm.$el.querySelector('#b')
-
-    expect(a.textContent).toBe('1')
-    expect(b.textContent).toBe('1')
-
-    a.click()
-    await Vue.nextTick()
-
-    expect(a.textContent).toBe('2')
-    expect(b.textContent).toBe('1')
-
-    b.click()
-    await Vue.nextTick()
-
-    expect(a.textContent).toBe('2')
-    expect(b.textContent).toBe('2')
-  })
 })