{"record":{"id":"ba57d01d389dab07","repo":"Meituan-Dianping/mpvue","slug":"select-multiple-v-model-binding-expression","errorCode":null,"errorMessage":"<select multiple v-model=\"${binding.expression}\"> expects an Array value for its binding, but got ${Object.prototype.toString.call(value).slice(8, -1)}","messagePattern":"<select multiple v-model=\"(.+?)\"> expects an Array value for its binding, but got (.+?)","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"src/platforms/web/runtime/directives/model.js","lineNumber":73,"sourceCode":"      // in case the options rendered by v-for have changed,\n      // it's possible that the value is out-of-sync with the rendered options.\n      // detect such cases and filter out values that no longer has a matching\n      // option in the DOM.\n      const needReset = el.multiple\n        ? binding.value.some(v => hasNoMatchingOption(v, el.options))\n        : binding.value !== binding.oldValue && hasNoMatchingOption(binding.value, el.options)\n      if (needReset) {\n        trigger(el, 'change')\n      }\n    }\n  }\n}\n\nfunction setSelected (el, binding, vm) {\n  const value = binding.value\n  const isMultiple = el.multiple\n  if (isMultiple && !Array.isArray(value)) {\n    process.env.NODE_ENV !== 'production' && warn(\n      `<select multiple v-model=\"${binding.expression}\"> ` +\n      `expects an Array value for its binding, but got ${\n        Object.prototype.toString.call(value).slice(8, -1)\n      }`,\n      vm\n    )\n    return\n  }\n  let selected, option\n  for (let i = 0, l = el.options.length; i < l; i++) {\n    option = el.options[i]\n    if (isMultiple) {\n      selected = looseIndexOf(value, getValue(option)) > -1\n      if (option.selected !== selected) {\n        option.selected = selected\n      }\n    } else {\n      if (looseEqual(getValue(option), value)) {","sourceCodeStart":55,"sourceCodeEnd":91,"githubUrl":"https://github.com/Meituan-Dianping/mpvue/blob/6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b/src/platforms/web/runtime/directives/model.js#L55-L91","documentation":"For `<select multiple v-model>`, the v-model directive's setSelected routine expects the bound value to be an Array (one entry per selected option). When the binding value is any other type (string, number, object, undefined), Vue warns in development, naming the expression and the actual type via Object.prototype.toString, because option matching against the value would fail.","triggerScenarios":"Binding a non-array to a multiple select: `v-model=\"selected\"` where selected is initialized to `''`, `null`, a number, or an object; receiving server data where the field is a single value instead of a list; using a computed that sometimes returns a scalar.","commonSituations":"Form initialization before async data loads (value is undefined/null at componentUpdated time); switching a single-select to `multiple` without changing the model from string to array; API responses that return a comma-separated string for multi-select fields.","solutions":["Initialize the v-model binding as an empty array: `selected: []`.","Normalize server/async data before assigning, e.g. `this.selected = Array.isArray(raw) ? raw : raw ? [raw] : []`.","If a computed supplies the value, make sure every return path yields an array.","When converting from single to multiple select, update the model shape alongside the template."],"exampleFix":"// before\ndata: { selected: null }\n<select multiple v-model=\"selected\">...\n// after\ndata: { selected: [] }\n<select multiple v-model=\"selected\">...","handlingStrategy":"type-guard","validationCode":"if (!Array.isArray(form.selectedOptions)) {\n  form.selectedOptions = []\n}","typeGuard":"function isArrayBinding(v) {\n  return Array.isArray(v)\n}","tryCatchPattern":null,"preventionTips":["Initialize multiple-select v-model state as [] not null/''/undefined.","Normalize API payloads to arrays before assigning to the model.","Ensure computeds feeding a multiple select always return arrays.","When toggling `multiple` on a select, change the model type at the same time."],"tags":["vue","v-model","select","array","directives","forms"],"backgroundTag":"expects-array-value","analyzedSha":"6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b","analyzedAt":"2026-09-02T05:17:40.946Z","contentChangedAt":null,"schemaVersion":2},"datasetVersion":"2026-09-09T11:17:12.671Z"}