我是新來的反應,我現在只是測驗一個簡單的渲染。我在瀏覽器中沒有收到任何錯誤,但在我的 javascript 反應檔案中出現的螢屏上沒有顯示任何內容。
html
<html>
<head>
<script type="text/babel" src="reactfile.js"> testing</script>
</head>
<link rel="stylesheet" href="/styles.css">
<body id="root">
<p>react test</p>
</body>
</html>
反應javascript檔案
import React from 'react';
import ReactDOM from 'react-dom';
class Helloworld extends React.Component {
render() {
return (
<div>
<p>Hello world!</p>
</div>
);
}
}
ReactDOM.render(<Helloworld />, document.getElementById('root'));
uj5u.com熱心網友回復:
您告訴這一行的反應是,您將在 id 元素中放入一些 HTML 代碼root:
ReactDOM.render(<Helloworld />, document.getElementById('root'));
但是,在您的 HTML 代碼中,沒有這樣的元素。為了使它作業,只需將此元素(帶有 id root)添加到您的頁面,如下所示:
<body id="app">
<div id="root"></div>
</body>
然后,您的 React 代碼將生成的每個代碼都將放入此元素中。
uj5u.com熱心網友回復:
制作 id 為“root”的 div 并在其下方添加腳本標簽。JavaScript 在決議它之前無法訪問根 div,這意味著 JavaScript 無法找到未出現在 DOM 樹中的元素。所以你應該把它的腳本代碼放在正文標記的行尾。
<body id="app">
<p>react test</p>
<div id="root></div>
<script type="text/babel" src="reactfile.js"></script>
</body>
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/408307.html
標籤:
