Meituan-Dianping/mpvue · error

"${key}" is a reserved attribute and cannot be used as compo

Error message

"${key}" is a reserved attribute and cannot be used as component prop.

What it means

Dev-only warning in initProps while declaring props: the component uses key or ref as a prop name. These are reserved attributes handled by Vue itself (vnode key and element ref) and are stripped before props are set, so declaring them as props can never receive the intended data.

Source

Thrown at packages/weex-vue-framework/factory.js:3095

  }
}

function initProps (vm, propsOptions) {
  var propsData = vm.$options.propsData || {};
  var props = vm._props = {};
  // cache prop keys so that future props updates can iterate using Array
  // instead of dynamic object key enumeration.
  var keys = vm.$options._propKeys = [];
  var isRoot = !vm.$parent;
  // root instance props should be converted
  observerState.shouldConvert = isRoot;
  var loop = function ( key ) {
    keys.push(key);
    var value = validateProp(key, propsOptions, propsData, vm);
    /* istanbul ignore else */
    if (process.env.NODE_ENV !== 'production') {
      if (isReservedAttribute(key) || config.isReservedAttr(key)) {
        warn(
          ("\"" + key + "\" is a reserved attribute and cannot be used as component prop."),
          vm
        );
      }
      defineReactive$$1(props, key, value, function () {
        if (vm.$parent && !isUpdatingChildComponent) {
          warn(
            "Avoid mutating a prop directly since the value will be " +
            "overwritten whenever the parent component re-renders. " +
            "Instead, use a data or computed property based on the prop's " +
            "value. Prop being mutated: \"" + key + "\"",
            vm
          );
        }
      });
    } else {
      defineReactive$$1(props, key, value);
    }

View on GitHub (pinned to 6c5d78ee04)

Solutions

1. Rename the prop to something non-reserved, e.g. itemKey or refId
2. Pass the value via a normal prop or attribute instead of key/ref

When it happens

Trigger: Thrown at packages/weex-vue-framework/factory.js:3095 when the library encounters an invalid state.

Common situations: See trigger scenarios.

AI-assisted analysis of Meituan-Dianping/mpvue@6c5d78ee04 (2026-09-02). Data as JSON: /api/errors/8e42c32da5f9aef5. Report an issue: GitHub.