react 报错 Property ‘updateForm‘ does not exist on type ‘JSX.IntrinsicElements‘.

问题描述:

在使用 react 写项目时候遇到了一个错误。
Property ‘updateForm’ does not exist on type ‘JSX.IntrinsicElements’.

//UpdateForm 中代码:
	const updateForm: FC<UpdateFormProps> = (props) => {
		//业务逻辑省略
	};
	export default updateForm;


//父级引用代码:
	import updateForm from './components/UpdateForm';
	//其他代码省略
	<updateForm />
	

原因分析:

react 官方文档中指明 用户定义的组件必须以大写字母开头

以小写字母开头的元素代表一个 HTML 内置组件,比如 <div> 或者 <span> 会生成相应的字符串 ‘div’ 或者 ‘span’ 传递给 React.createElement(作为参数)。大写字母开头的元素则对应着在 JavaScript 引入或自定义的组件,如 <Foo /> 会编译为 React.createElement(Foo)。

建议使用大写字母开头命名自定义组件。如果你确实需要一个以小写字母开头的组件,则在 JSX 中使用它之前,必须将它赋值给一个大写字母开头的变量。


解决方案:

将代码中的标签首字母修改为大写,如下:

//UpdateForm 中代码:
	const UpdateForm: FC<UpdateFormProps> = (props) => {
		//业务逻辑省略
	};
	export default UpdateForm;


//父级引用代码:
	import UpdateForm './components/UpdateForm';
	//其他代码省略
	<UpdateForm/>
	
上一篇:Vue JSX、自定义 v-model


下一篇:react (3 JSX语法)