{"record":{"id":"0a3c3f6d20a6f2f8","repo":"Meituan-Dianping/mpvue","slug":"key-is-a-reserved-attribute-and-cannot-be-use-0a3c3f","errorCode":null,"errorMessage":"\"${key}\" is a reserved attribute and cannot be used as component prop.","messagePattern":"\"(.+?)\" is a reserved attribute and cannot be used as component prop\\.","errorType":"console","errorClass":null,"httpStatus":null,"severity":"error","filePath":"src/core/instance/state.js","lineNumber":87,"sourceCode":"  }\n}\n\nfunction initProps (vm: Component, propsOptions: Object) {\n  const propsData = vm.$options.propsData || {}\n  const props = vm._props = {}\n  // cache prop keys so that future props updates can iterate using Array\n  // instead of dynamic object key enumeration.\n  const keys = vm.$options._propKeys = []\n  const isRoot = !vm.$parent\n  // root instance props should be converted\n  observerState.shouldConvert = isRoot\n  for (const key in propsOptions) {\n    keys.push(key)\n    const value = validateProp(key, propsOptions, propsData, vm)\n    /* istanbul ignore else */\n    if (process.env.NODE_ENV !== 'production') {\n      if (isReservedAttribute(key) || config.isReservedAttr(key)) {\n        warn(\n          `\"${key}\" is a reserved attribute and cannot be used as component prop.`,\n          vm\n        )\n      }\n      defineReactive(props, key, value, () => {\n        if (vm.$parent && !isUpdatingChildComponent) {\n          warn(\n            `Avoid mutating a prop directly since the value will be ` +\n            `overwritten whenever the parent component re-renders. ` +\n            `Instead, use a data or computed property based on the prop's ` +\n            `value. Prop being mutated: \"${key}\"`,\n            vm\n          )\n        }\n      })\n    } else {\n      defineReactive(props, key, value)\n    }","sourceCodeStart":69,"sourceCodeEnd":105,"githubUrl":"https://github.com/Meituan-Dianping/mpvue/blob/6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b/src/core/instance/state.js#L69-L105","documentation":"Fires in the initProps loop when a declared prop key matches a reserved attribute: the check isReservedAttribute(key) (key, ref, slot, is...) or config.isReservedTag for platform-reserved names. Attributes like 'key' and 'ref' carry special meaning in VNode data and cannot be passed as ordinary component props — declaring them as props would collide with Vue's internal patch/allocation mechanisms, so the key is rejected with this dev warning.","triggerScenarios":"Thrown at src/core/instance/state.js:87 when the library encounters an invalid state.","commonSituations":"See trigger scenarios.","solutions":["Rename the prop to something else (e.g. 'itemKey' instead of 'key', 'reference' instead of 'ref')","Pass the special attribute normally (e.g. :key on the component tag) instead of declaring it as a prop","Avoid naming props after reserved HTML tags for the active platform"],"exampleFix":null,"handlingStrategy":"validation","validationCode":null,"typeGuard":null,"tryCatchPattern":null,"preventionTips":[],"tags":[],"backgroundTag":null,"analyzedSha":"6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b","analyzedAt":"2026-09-02T05:17:40.946Z","contentChangedAt":null,"schemaVersion":2},"datasetVersion":"2026-09-09T11:17:12.671Z"}