在Codepen.io上使用React.js，自定義標記爲什麼不呈現？

一個非常初學者和愚蠢的問題，也許，但仍，每個人都學會在第一..在Codepen.io上使用React.js，自定義標記爲什麼不呈現？

HTML

<div class="container" id="container">

CSS（SCSS）

$back:#1D1F20; 
$font:'Open Sans',sans serif; 
body{ 
    background-color:$back; 
    padding:20px; 
    h1{ 
    font-family:$font; 
    color:white; 
    } 
    DisplayBox{ 
    font-family:$font; 
    color:white; 
    } 
}

JS（Babel）

var DisplayBox=React.createClass({ 
    render:function(){ 
     return (
      <h1>Marked</h1> 
     ); 
    } 
}); 

React.render(<DisplayBox />,document.getElementById("container"));

我的目標是使#container的內部的自定義標籤顯示框，但它不是在codepen.io渲染 JS config in Codepen CSS config

感謝您的幫助提前:-)

來源

2017-04-12 Saptarshi Soham Mohanta

可能的複製[陣營組分不呈現到的index.html]（http://stackoverflow.com/questions/40043522/react-component -isnt-rendered-to-index-html） –

由於您使用的是React的15.4.2版本，我建議您通過擴展React.Component移動到創建React組件的ES6方式 –

而不是

React.render(<DisplayBox />,document.getElementById("container"));

使用

ReactDOM.render(<DisplayBox />,document.getElementById("container"));

檢查工作example

檢查的difference between React and ReactDOM

來源

2017-04-12 05:28:13

在Codepen.io上使用React.js，自定義標記爲什麼不呈現？

回答

相關問題