{"record":{"id":"86e9a4f58a03292e","repo":"Meituan-Dianping/mpvue","slug":"el-tag-v-model-value-v-model-is-not-sup","errorCode":null,"errorMessage":"<${el.tag} v-model=\"${value}\">: v-model is not supported on this element type. If you are working with contenteditable, it's recommended to wrap a library dedicated for that purpose inside a custom component.","messagePattern":"<(.+?) v-model=\"(.+?)\">: v-model is not supported on this element type\\. If you are working with contenteditable, it's recommended to wrap a library dedicated for that purpose inside a custom component\\.","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"src/platforms/mp/compiler/directives/model.js","lineNumber":60,"sourceCode":"\n  if (el.component) {\n    genComponentModel(el, value, modifiers)\n    // component v-model doesn't need extra runtime\n    return false\n  } else if (tag === 'select') {\n    genSelect(el, value, modifiers)\n  } else if (tag === 'input' && type === 'checkbox') {\n    genCheckboxModel(el, value, modifiers)\n  } else if (tag === 'input' && type === 'radio') {\n    genRadioModel(el, value, modifiers)\n  } else if (tag === 'input' || tag === 'textarea') {\n    genDefaultModel(el, value, modifiers)\n  } else if (!config.isReservedTag(tag)) {\n    genComponentModel(el, value, modifiers)\n    // component v-model doesn't need extra runtime\n    return false\n  } else if (process.env.NODE_ENV !== 'production') {\n    warn(\n      `<${el.tag} v-model=\"${value}\">: ` +\n      `v-model is not supported on this element type. ` +\n      'If you are working with contenteditable, it\\'s recommended to ' +\n      'wrap a library dedicated for that purpose inside a custom component.'\n    )\n  }\n\n  // ensure runtime directive metadata\n  return true\n}\n\nfunction genCheckboxModel (\n  el: ASTElement,\n  value: string,\n  modifiers: ?ASTModifiers\n) {\n  const number = modifiers && modifiers.number\n  const valueBinding = getBindingAttr(el, 'value') || 'null'","sourceCodeStart":42,"sourceCodeEnd":78,"githubUrl":"https://github.com/Meituan-Dianping/mpvue/blob/6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b/src/platforms/mp/compiler/directives/model.js#L42-L78","documentation":"The mp compiler's `model` directive transforms `v-model` on known form tags or on components. If the tag is neither a supported form element nor a registered/reserved component (i.e., `config.isReservedTag(tag)` is true but the tag isn't modelable), `v-model` cannot generate any binding and the compiler warns.","triggerScenarios":"`v-model` on unsupported reserved elements like `<div>`, `<span>`, `<form>`, `<img>`, or on contenteditable elements in an mp target template.","commonSituations":"Typos in tag names; trying to two-way-bind non-form elements; contenteditable editors (not supported by v-model by design); copy-pasted templates targeting the wrong platform.","solutions":["Use v-model only on supported form elements (`input`, `textarea`, `picker`, etc.) in mp targets","For contenteditable, wrap a dedicated library inside a custom component and use value/input events","For non-form elements, bind explicitly with `:prop` + `@event` instead of v-model","Fix tag-name typos that make the element an unmodelable reserved tag"],"exampleFix":"// before\n<div v-model=\"text\"></div>\n// after\n<div>{{ text }}</div>\n<input v-model=\"text\">","handlingStrategy":"validation","validationCode":"const MODELABLE = ['input', 'textarea', 'select', 'picker']\nfunction assertModelableTag (tag, isComponent) {\n  if (!MODELABLE.includes(tag) && !isComponent) {\n    throw new Error(`v-model not supported on <${tag}>`) \n  }\n}","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Use v-model only on form elements or components in mp templates","Use explicit :prop/@event for non-form elements","Use a dedicated contenteditable component wrapper","Fix tag-name typos early with editor schema validation"],"tags":["v-model","compiler","mini-program"],"backgroundTag":"v-model-unsupported-element","analyzedSha":"6c5d78ee04f58c6d782c456dfcf0fe63c0b7f89b","analyzedAt":"2026-09-02T05:17:40.946Z","contentChangedAt":null,"schemaVersion":2},"datasetVersion":"2026-09-09T11:17:12.671Z"}