{"record":{"id":"387aee52086e825b","repo":"Meituan-Dianping/mpvue","slug":"method-key-has-already-been-defined-as-a-prop-387aee","errorCode":null,"errorMessage":"method \"${key}\" has already been defined as a prop.","messagePattern":"method \"(.+?)\" has already been defined as a prop\\.","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"src/core/instance/state.js","lineNumber":249,"sourceCode":"    }\n  }\n}\n\nfunction initMethods (vm: Component, methods: Object) {\n  process.env.NODE_ENV !== 'production' && checkOptionType(vm, 'methods')\n  const props = vm.$options.props\n  for (const key in methods) {\n    vm[key] = methods[key] == null ? noop : bind(methods[key], vm)\n    if (process.env.NODE_ENV !== 'production') {\n      if (methods[key] == null) {\n        warn(\n          `method \"${key}\" has an undefined value in the component definition. ` +\n          `Did you reference the function correctly?`,\n          vm\n        )\n      }\n      if (props && hasOwn(props, key)) {\n        warn(\n          `method \"${key}\" has already been defined as a prop.`,\n          vm\n        )\n      }\n    }\n  }\n}\n\nfunction initWatch (vm: Component, watch: Object) {\n  process.env.NODE_ENV !== 'production' && checkOptionType(vm, 'watch')\n  for (const key in watch) {\n    const handler = watch[key]\n    if (Array.isArray(handler)) {\n      for (let i = 0; i < handler.length; i++) {\n        createWatcher(vm, key, handler[i])\n      }\n    } else {\n      createWatcher(vm, key, handler)","sourceCodeStart":231,"sourceCodeEnd":267,"githubUrl":"https://github.com/Meituan-Dianping/mpvue/blob/6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b/src/core/instance/state.js#L231-L267","documentation":"Vue dev-mode warning from initMethods when a method name is also declared in the props option. Since methods are bound to the instance after props, the method assignment would overwrite the prop, so Vue warns about the conflict (the method still binds to the instance key).","triggerScenarios":"Declaring the same key in props and methods, e.g. props:['submit'] plus methods:{submit(){...}}; mixin merge adding a method that collides with an existing prop.","commonSituations":"Generic prop names like 'change', 'submit', 'open' colliding with handler methods of the same name; converting a callback prop into an internal method without renaming.","solutions":["Rename the method to a non-colliding name","Rename the prop if it is internal-only and not part of the public API","Invoke the prop callback from a differently named method instead of replacing it"],"exampleFix":"// before\nexport default {\n  props: ['submit'],\n  methods: { submit() { this.submit && this.submit(this.value) } }\n}\n// after\nexport default {\n  props: ['submit'],\n  methods: { handleSubmit() { this.$emit('submit', this.value) } }\n}","handlingStrategy":"validation","validationCode":"function checkMethodPropsCollision(options) {\n  const propKeys = (options.props || []).concat(Object.keys(options.props || {}))\n  return Object.keys(options.methods || {}).filter(k => propKeys.includes(k))\n}","typeGuard":"function hasNoMethodPropsCollision(options) { return checkMethodPropsCollision(options).length === 0 }","tryCatchPattern":null,"preventionTips":["Prefix handlers with on/handle (handleSubmit) so they never match prop names","Run eslint-plugin-vue no-dupe-keys","Never name methods after callback props; emit events instead"],"tags":["vue","methods","props","naming-collision"],"backgroundTag":"duplicate-property-definition","analyzedSha":"6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b","analyzedAt":"2026-09-02T05:17:40.946Z","contentChangedAt":null,"schemaVersion":2},"datasetVersion":"2026-09-09T11:17:12.671Z"}