项目场景:
提示:这里简述项目相关背景:
访问页面时,调试时,前端页面出现 红色 varn 信息,报错信息如下所示
问题描述
提示:这里描述项目中遇到的问题:
错误信息:
Invalid component name: "合同审核". Component names should conform to valid custom element name in html5
原因分析:
提示:这里填写问题的分析:
这个错误通常出现在使用 Vue 或者其他类似框架时,组件的名称必须符合 HTML5 规范中的自定义元素名称格式。
解决方案:
解决方案:
自定义元素名称必须满足以下规则:
必须以小写字母开头
必须包含一个短横线“-”
不能包含大写字母
不能是保留的 HTML 元素名称
因此,建议将组件名从“合同审核”更改为“contract-audit”、“contractAudit”或其他类似的名称,以符合规范并避免导致这个错误。
在 Vue 中,组件名称可以通过 name 选项设置,例如:
Vue.component(‘contract-audit’, {
// …
name: ‘ContractAudit’,
// …
})
这样设置后,在模板中使用 或 都将是有效的。
知识小结:
1、必须以小写字母开头
2、必须包含一个短横线“-”
3、不能包含大写字母
4、不能是保留的 HTML 元素名称