feat(runtime-core): implement RFC-0020

BREAKING CHANGE: data no longer supports object format (per RFC-0020)

Author: yyx990803

packages/runtime-core/__tests__/apiOptions.spec.ts

@@ -634,9 +634,9 @@ describe('api: options', () => {
     test('data property is already declared in props', () => {
       const Comp = {
         props: { foo: Number },
-        data: {
+        data: () => ({
           foo: 1
-        },
+        }),
         render() {}
       }
 
@@ -649,9 +649,9 @@ describe('api: options', () => {
 
     test('computed property is already declared in data', () => {
       const Comp = {
-        data: {
+        data: () => ({
           foo: 1
-        },
+        }),
         computed: {
           foo() {}
         },
@@ -699,9 +699,9 @@ describe('api: options', () => {
 
     test('methods property is already declared in data', () => {
       const Comp = {
-        data: {
+        data: () => ({
           foo: 2
-        },
+        }),
         methods: {
           foo() {}
         },

packages/runtime-core/src/apiOptions.ts

@@ -167,7 +167,7 @@ export interface LegacyOptions<
   // Limitation: we cannot expose RawBindings on the `this` context for data
   // since that leads to some sort of circular inference and breaks ThisType
   // for the entire component.
-  data?: D | ((this: ComponentPublicInstance<Props>) => D)
+  data?: (this: ComponentPublicInstance<Props>) => D
   computed?: C
   methods?: M
   watch?: ComponentWatchOptions
@@ -280,7 +280,13 @@ export function applyOptions(
 
   // state options
   if (dataOptions) {
-    const data = isFunction(dataOptions) ? dataOptions.call(ctx) : dataOptions
+    if (__DEV__ && !isFunction(dataOptions)) {
+      warn(
+        `The data option must be a function. ` +
+          `Plain object usage is no longer supported.`
+      )
+    }
+    const data = dataOptions.call(ctx)
     if (!isObject(data)) {
       __DEV__ && warn(`data() should return an object.`)
     } else if (instance.data === EMPTY_OBJ) {

packages/vue/__tests__/index.spec.ts

@@ -89,9 +89,9 @@ describe('compiler + runtime integration', () => {
 
   it('should support using element innerHTML as template', () => {
     const app = createApp({
-      data: {
+      data: () => ({
         msg: 'hello'
-      }
+      })
     })
     const container = document.createElement('div')
     container.innerHTML = '{{msg}}'