{"record":{"id":"2589265b58f6f168","repo":"Meituan-Dianping/mpvue","slug":"the-computed-property-key-is-already-defined-258926","errorCode":null,"errorMessage":"The computed property \"${key}\" is already defined in data.","messagePattern":"The computed property \"(.+?)\" is already defined in data\\.","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"src/core/instance/state.js","lineNumber":195,"sourceCode":"      if (getter === undefined) {\n        warn(\n          `No getter function has been defined for computed property \"${key}\".`,\n          vm\n        )\n        getter = noop\n      }\n    }\n    // create internal watcher for the computed property.\n    watchers[key] = new Watcher(vm, getter, noop, computedWatcherOptions)\n\n    // component-defined computed properties are already defined on the\n    // component prototype. We only need to define computed properties defined\n    // at instantiation here.\n    if (!(key in vm)) {\n      defineComputed(vm, key, userDef)\n    } else if (process.env.NODE_ENV !== 'production') {\n      if (key in vm.$data) {\n        warn(`The computed property \"${key}\" is already defined in data.`, vm)\n      } else if (vm.$options.props && key in vm.$options.props) {\n        warn(`The computed property \"${key}\" is already defined as a prop.`, vm)\n      }\n    }\n  }\n}\n\nexport function defineComputed (target: any, key: string, userDef: Object | Function) {\n  if (typeof userDef === 'function') {\n    sharedPropertyDefinition.get = createComputedGetter(key)\n    sharedPropertyDefinition.set = noop\n  } else {\n    sharedPropertyDefinition.get = userDef.get\n      ? userDef.cache !== false\n        ? createComputedGetter(key)\n        : userDef.get\n      : noop\n    sharedPropertyDefinition.set = userDef.set","sourceCodeStart":177,"sourceCodeEnd":213,"githubUrl":"https://github.com/Meituan-Dianping/mpvue/blob/6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b/src/core/instance/state.js#L177-L213","documentation":"Vue dev-mode warning thrown by initComputed when a computed property name collides with a key already present in the instance's data. Since data is initialized before computed, the computed would shadow or be shadowed by the data property, creating ambiguous reactivity. Vue refuses to define the computed and warns instead.","triggerScenarios":"Declaring the same key in both the data option and the computed option of a component or root instance; e.g. data(){return{total:0}} plus computed:{total(){...}}. Also occurs when a mixin or plugin merges in a computed that clashes with existing data.","commonSituations":"Renaming refactors that leave a stale data field; merging mixins where each side defines overlapping keys; adding a computed with a name matching a common data field like 'loading' or 'items'.","solutions":["Rename the computed property so it no longer collides with the data key","Remove the data field if the computed fully replaces it","If the data field is needed raw, expose the computed under a derived name","Check merged mixins for overlapping computed/data keys"],"exampleFix":"// before\nexport default {\n  data() { return { total: 0 } },\n  computed: { total() { return this.items.length } }\n}\n// after\nexport default {\n  computed: { totalCount() { return this.items.length } }\n}","handlingStrategy":"validation","validationCode":"function checkComputedDataCollision(options) {\n  const dataKeys = typeof options.data === 'function' ? Object.keys(options.data()) : Object.keys(options.data || {})\n  return Object.keys(options.computed || {}).filter(k => dataKeys.includes(k))\n}\n// if (checkComputedDataCollision(myOptions).length) fix names before mounting","typeGuard":"function hasNoComputedDataCollision(options) { return checkComputedDataCollision(options).length === 0 }","tryCatchPattern":null,"preventionTips":["Keep computed names derived (e.g. totalCount, isReady) vs raw data names","Lint with eslint-plugin-vue's no-dupe-keys rule","Audit mixins for key overlaps before merging"],"tags":["vue","reactivity","naming-collision","computed","data"],"backgroundTag":"duplicate-property-definition","analyzedSha":"6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b","analyzedAt":"2026-09-02T05:17:40.946Z","contentChangedAt":null,"schemaVersion":2},"datasetVersion":"2026-09-09T11:17:12.671Z"}