[英]Element type is invalid: expected a string (...) but got: object
import React from 'react';
import ReactDOM from 'react-dom';
class Car extends React.Component {
render() {
return <h2>Hi, I am a Car!</h2>;
}
}
export default Car;
import React from 'react';
import ReactDOM from 'react-dom';
import Car from './App.js';
ReactDOM.render(<Car />, document.getElementById('root'));
I am getting the error: Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.我收到错误:错误:元素类型无效:应为字符串(对于内置组件)或类/函数(对于复合组件)但得到:对象。 You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
您可能忘记从定义组件的文件中导出组件,或者您可能混淆了默认导入和命名导入。
Check the render method of HotExportedComponent
.检查
HotExportedComponent
的渲染方法。
I know the import is pointing to the correct class.我知道导入指向正确的类。 When I first run locally the desired text shows in the browser "Hi, I am a Car!".
当我第一次在本地运行时,浏览器中会显示所需的文本“嗨,我是一辆车!”。 Then about half a second later the error pops up.
然后大约半秒钟后,错误弹出。 I'm thinking it's something with the hot reload as indicated in the error message.
我认为这与错误消息中指示的热重载有关。 Also I am using Gatsby for this.
我也为此使用 Gatsby。
Gatsby uses a built-in parsing from React, you don't need to import the ReactDOM
in your index.js
page like a standalone React application. Gatsby 使用来自 React 的内置解析,您不需要像独立的 React 应用程序那样在
index.js
页面中导入ReactDOM
。 Just:只是:
import React from 'react';
// import ReactDOM from 'react-dom'; //remove it
import Car from './App.js';
const Index = ()=>{
return <Car/>
}
export default Index;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.