feat(runtime-core): implement RFC-0020

BREAKING CHANGE: data no longer supports object format (per RFC-0020)
vuejs · Mar 12, 2020 · bb7fa3d · bb7fa3d
1 parent dd17fa1
commit bb7fa3d
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 10 deletions.
diff --git a/packages/runtime-core/__tests__/apiOptions.spec.ts b/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() {}
  },

diff --git a/packages/runtime-core/src/apiOptions.ts b/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) {

diff --git a/packages/vue/__tests__/index.spec.ts b/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}}'