高阶组件:React.createElement:类型无效
问题描述:
我有一个组件someComponent
,并且函数withMoreStuff
需要一个类,返回一个类。我检查了所有的导入/导出,没有任何默认或命名导出的问题。高阶组件:React.createElement:类型无效
错误:React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined.
// @flow
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { withMoreStuff } from 'hocs';
import { someComponent } from 'components';
type PropsType = {
data: [{ id: number }],
}
const wrappedComponent = withMoreStuff(someComponent);
class ItemList extends Component {
props: PropsType;
renderRows(data: any) {
return data.map(item =>
<wrappedComponent key={item.id} data={item} />
);
}
render() {
return (
<div>
{this.renderRows(this.props.data)}
</div>
);
}
};
export default ItemList;
错误从这个文件返回跟它的wrappedComponent
是不是有效的类。
如果我招行const wrappedComponent = withMoreStuff(someComponent);
到渲染方法会正确显示:
render() {
const wrappedComponent = withMoreStuff(someComponent);
return (
<div>
{this.renderRows(this.props.data)}
</div>
);
}
为什么???
答
我相信你没有收到任何道具和你renderRows
方法不返回任何东西,检查是否能解决它:
renderRows(data: any) {
if(!data) return </div>;
return data.map(item =>
<wrappedComponent key={item.id} data={item} />
);
}
声明'wrappedComponent'在渲染没有任何意义,因为你正在使用它在'renderRows'中。 – Valentin