Vue组件prop校验报错：modelName预期String却得到Undefined如何解决？

你在绑定modelName属性时误用了v-bind（即属性名前的:前缀）。按照Vue的语法规则，带v-bind前缀的属性值会被当做当前组件作用域下的JS表达式解析，你写的NewParticipant会被识别为组件变量，你当前作用域下没有定义该变量，所以实际传入SelectableAttribute组件的值为undefined，触发类型校验报错。

两种任选其一即可：

• 去掉model-name前的v-bind前缀，直接走静态字符串传入逻辑：

<SelectableAttribute
    :attr-name="props2.row.fieldClass"
    :attr-id="itemProps.row.id"
    :model-id="props.row.id"
    model-name="NewParticipant"
>

• 保留v-bind前缀的话，给值套一层单引号，显式声明为字符串表达式：

:model-name="'NewParticipant'"

你当前引用的组件名为SelectableAttribute，但提供的组件文件名为SelectedAttributes.vue，请确认组件注册时的名称拼写、单复数是否匹配，避免命名不一致导致的其他异常。

内容的提问来源于stack exchange，提问作者cbln