无状态组件:必须返回有效的React元素(或null)
lom*_*mse 5 html javascript jsx ecmascript-6 reactjs
我是ReactJS的新手.
我正在尝试Hello world使用下面的代码显示,但我收到此错误消息:
我错过了什么？
App.js的代码
//App.js`
import React from 'react';
const App = () => "<h1>Hello World!</h1>";
export default App;
index.js的代码
//index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
ReactDOM.render(
<App />,
document.getElementById('root')
);
/public/index.html的代码
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>React App</title>
</head>
<body>
<div id="root"></div>
</body>
</html>
您不能将JSX元素包装在引号中.
改变这个
const App = () => "<h1>Hello World!</h1>";
这样
const App = () => <h1>Hello World!</h1>;
你也可以这样写
const App = () => {
return <h1>Hello World!</h1>;
};
或者像这样
const App = () => {
return (
<h1>
Hello World!
</h1>
);
};
| 归档时间： |
|
| 查看次数： |
936 次 |
| 最近记录： |