我正在编写一个hoc-in-react来处理一些滚动功能的繁重提升。我很难让组件进行渲染。我一直收到这个错误:
warning.js?d9a2:33 Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object.
我把它简化为hoc中最基本的部分,我仍然得到这个错误。这是我的代码:
这就是hoc本身:
import React from 'react';
const withOnScreenMonitor = WrappedComponent => {
return class OnScreenMonitor extends React.Component {
render(){
return (
<WrappedComponent/>
)
}
}
};
export default withOnScreenMonitor;
这就是我在我的一个视图中使用它的方式:
import withOnScreenMonitor from "../global-elements/OnScreenMonitor";
render(){
//// other code
const ComponentWithOnScreenMonitor = withOnScreenMonitor(<div>test</div>);
return (
<Fragment>
<div>
/// other components
</div>
<ComponentWithOnScreenMonitor/>
</Fragment>
)
}
我不断地得到这个错误。我在如何设置这个hoc时是否遗漏了一些东西?