2015-05-16 11 views
20

Przeszukałem samouczek dotyczący pliku react.js, za pomocą prostego przykładu z Witaj świecie. Nie mogę znaleźć powodu, dla którego poniższe czynności nie powinny działać, ale nadal otrzymuję ten błąd.Nieprawidłowy element składowy w React.JS

Uncaught Error: Invariant Violation: React.render(): Invalid component element. 

Mam następujący kod. Wydaje się działać, jeśli robię React.createElement, ale nie dla elementów JSX.

<!doctype html> 
<html> 
<head> 
    <script src="https://fb.me/react-0.13.3.js"></script> 
    <script src="https://fb.me/JSXTransformer-0.13.3.js"></script> 
    <script type="text/jsx"> 
     document.body.onload = function(){ 
      console.log("shuff") 
      var HelloWorld = React.createClass({ 
       render: function(){ 
        return <div>Hello, Ian Shuff!</div>; 
       } 
      }); 

      React.render(new HelloWorld(), document.getElementById("test")) 
     } 

    </script> 
</head> 
<body> 
    <div id="test"></div> 
</body> 
</html> 

Odpowiedz

21

Należy przejść do renderowania <HelloWorld /> nie new HelloWorld()

React.render(<HelloWorld />, document.getElementById("test")) 

Example

jsx-in-depth

Albo można użyć React.createElement, tak jak

React.render(React.createElement(HelloWorld, null), document.getElementById("test")) 

Example

Powiązane problemy