Meituan-Dianping/mpvue · warning

method "${key}" has already been defined as a prop.

Error message

method "${key}" has already been defined as a prop.

What it means

During methods initialization, Vue checks each method key against the component's props; a method sharing a prop's name would overwrite the prop binding on the instance (or be overwritten), so Vue warns about the conflict.

Source

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

    }
  }
}

function initMethods (vm, methods) {
  process.env.NODE_ENV !== 'production' && checkOptionType(vm, 'methods');
  var props = vm.$options.props;
  for (var key in methods) {
    vm[key] = methods[key] == null ? noop : bind(methods[key], vm);
    if (process.env.NODE_ENV !== 'production') {
      if (methods[key] == null) {
        warn(
          "method \"" + key + "\" has an undefined value in the component definition. " +
          "Did you reference the function correctly?",
          vm
        );
      }
      if (props && hasOwn(props, key)) {
        warn(
          ("method \"" + key + "\" has already been defined as a prop."),
          vm
        );
      }
    }
  }
}

function initWatch (vm, watch) {
  process.env.NODE_ENV !== 'production' && checkOptionType(vm, 'watch');
  for (var key in watch) {
    var handler = watch[key];
    if (Array.isArray(handler)) {
      for (var i = 0; i < handler.length; i++) {
        createWatcher(vm, key, handler[i]);
      }
    } else {
      createWatcher(vm, key, handler);

View on GitHub (pinned to 6c5d78ee04)

Solutions

1. Rename the method (e.g. openModal, doOpen)
2. Rename the prop if it is your own component API and the name is better suited to a function
3. Remove the method if it duplicates behavior already provided by the prop usage pattern

Example fix

// before
props: ['open'],
methods: { open() { this.visible = true; } }
// after
props: ['open'],
methods: { openPanel() { this.visible = true; } }

function checkMethodPropCollisions(options) {
  const props = options.props || [];
  const propNames = Array.isArray(props) ? props : Object.keys(props);
  return Object.keys(options.methods || {}).filter(k => propNames.includes(k));
}

When it happens

Trigger: Declaring a method whose name equals a declared prop, e.g. props: ['open'] and methods: { open() {...} }.

Common situations: Mixin methods colliding with component props, generic method names like 'value', 'title', 'open' matching prop names, or legacy components gaining a prop during an API change.

Related errors

• method "${key}" has already been defined as a prop.
• method "${key}" has already been defined as a data property.
• The data property "${key}" is already declared as a prop. Us
• The computed property "${key}" is already defined as a prop.
• The computed property "${key}" is already defined as a prop.

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