Hello World在JSBin上不起作用

-1

我的簡單hello世界嘗試有什麼問題？這裏的the JSBin Hello World在JSBin上不起作用

class Hello extends React.Component { 
    render() { 
    return(
     <h1>Hello {this.props.name}</h1> 
    ) 
    } 
} 

React.render(
    <Hello name="World!"/>, 
    document.getElementById('name'); 
)

來源

2016-09-20 Maria Jane

這是0.14引入的最新變化。他們將React分割成核心庫和DOM適配器。渲染現在通過ReactDOM.render()

完成，因爲您使用的版本15.1.0你應該使用ReactDOM.render（），爲了做到這一點，你需要包括反應-DOM作爲依賴於你的jsbin HTML作爲

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

也在ReactDOM.render您需要將分號放在 ReactDOM.render();之後，而不是在裏面。

這是工作片段。

class Hello extends React.Component { 
 
    render() { 
 
    return(
 
    <h1>Hello {this.props.name}</h1> 
 
    ) 
 
    } 
 
} 
 

 
ReactDOM.render(
 
    <Hello name="World!"/>, 
 
    document.getElementById('name') 
 
);

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 
    <div id="name"></div> 
 
</body> 
 
</html>

來源

2016-09-21 03:47:01

您呈現到DOM與模塊ReactDOM，分開React：

ReactDOM.render(<Hello name="World!" />, document.getElementById("name"));

此外，您的分號是錯誤的。請記住，ReactDOM是一個不同的模塊。每the documentation：

的反應-DOM包提供了可以在您的應用程序的頂層使用的特定DOM的方法...

ReactDOM.render
render(
    ReactElement element, 
    DOMElement container, 
    [function callback] 
) 

來源

2016-09-20 16:29:06 Li357

Hello World在JSBin上不起作用

回答

相關問題