遇到反應教程的問題，不變違規

我試圖按照反應教程，但它不工作。下面的代碼：遇到反應教程的問題，不變違規

// load react library 
var React = require('react'); 
var ReactDOM = require('react-dom'); 

/* 
    App 
*/ 

var App = React.createClass({ 
    render: function(){ 
     <div className='catch-of-the-day'> 
      <div className='menu'> 
       <Header /> 
      </div> 
     </div> 
    } 
}); 

var Header = React.createClass({ 
    render : function() { 
     return(
       <p>Header</p> 
      ) 
    } 

}); 




//build first component 
/* 
    StorePicker 
*/ 


var StorePicker = React.createClass({ 

    render : function(){ 
     var name = 'Bob'; 
     return (
      <form className='store-selector'> 
       {/* comments go here */} 
       <h2>Please Enter A Store {/* {name} */}</h2> 
       <input type="text" ref='storeId' required/> 
       <input type="submit"/> 
      </form>   
     ) 
    } 
}); 


ReactDOM.render(<App/>,document.querySelector('#main'));

這裏的HTML：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Catch of the Day!</title> 
    <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Open+Sans' rel='stylesheet' type='text/css'> 
    <link rel="stylesheet" href="/build/css/style.css"> 
    <link rel="shortcut icon" href="http://facebook.github.io/react/favicon.ico"> 
</head> 
<body> 

    <input type="checkbox" id="fold"> 
    <label for="fold">Fold</label> 

    <div id="main"> 
     <!-- This is where our React app will go --> 
    </div> 
    <div id='new'> 
    </div> 

    <script src="/build/main.js"></script> 

</body> 
</html>

和這裏的錯誤消息：

Uncaught Error: Invariant Violation: App.render(): A valid ReactComponent 
must be returned. You may have returned undefined, an array or some other 
invalid object.

來源

2017-06-06 DCR

您App#render不返回任何東西。或多或少的錯誤信息說。

對比App#render與Header#render。

無關，但您可能需要遵循更近期的教程; createClass已棄用。

來源

2017-06-06 20:37:02

遇到反應教程的問題，不變違規

回答

相關問題