{"record":{"id":"df5f63cc46f7a2d8","repo":"Meituan-Dianping/mpvue","slug":"the-computed-property-key-is-already-defined-df5f63","errorCode":null,"errorMessage":"The computed property \"${key}\" is already defined as a prop.","messagePattern":"The computed property \"(.+?)\" is already defined as a prop\\.","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"packages/weex-vue-framework/factory.js","lineNumber":3207,"sourceCode":"          (\"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\nfunction defineComputed (target, key, userDef) {\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\n      ? userDef.set\n      : noop;","sourceCodeStart":3189,"sourceCodeEnd":3225,"githubUrl":"https://github.com/Meituan-Dianping/mpvue/blob/6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b/packages/weex-vue-framework/factory.js#L3189-L3225","documentation":"Same collision check as data: if a computed key matches a declared prop, Vue skips defineComputed and warns, because the prop is set up earlier and the computed would never be reachable under that name on the instance.","triggerScenarios":"computed: { foo() {...} } where foo is also declared in the props option of the component.","commonSituations":"Naming a computed after a prop to 'transform' it (use a differently named computed instead), mixins providing computed keys that overlap props, code generators emitting prop and computed with the same identifier.","solutions":["Rename the computed (e.g. formattedFoo) and derive it from the prop","Delete the computed if it duplicates the prop's value","Move the derived logic into a method if the name must stay"],"exampleFix":"// before\nprops: ['user'],\ncomputed: { user() { return this.$store.state.user; } }\n// after\nprops: ['user'],\ncomputed: { storeUser() { return this.$store.state.user; } }","handlingStrategy":"validation","validationCode":"function checkComputedPropCollisions(options) {\n  const props = options.props || [];\n  const propNames = Array.isArray(props) ? props : Object.keys(props);\n  return Object.keys(options.computed || {}).filter(k => propNames.includes(k));\n}","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Never name computed properties after props","Prefix transformed-prop computeds (formattedX, displayX)","Check mixins for prop/computed overlap"],"tags":["vue","computed","props","naming-collision"],"backgroundTag":"option-name-collision","analyzedSha":"6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b","analyzedAt":"2026-09-02T05:17:40.946Z","contentChangedAt":null,"schemaVersion":2},"datasetVersion":"2026-09-09T11:17:12.671Z"}