Ad

React Starter Template Render Nothing

- 1 answer

<body>
    <div id="content"></div>

    <script type="text/jsx">
     var x = React.createClass({
        render:function(){
            return (
                <h1>I love react</h1>
            );
        }
     });

     React.render(<x/>,document.getElementById('content'));
    </script>
</body>

What's wrong with my reactjs code below? it render nothing. I've included

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

in the head.

Ad

Answer

You have several mistakes

  1. you need include ReactDOM and use ReactDOM.render, because since version 0.14.*.render method that located in React is deprecated.
  2. to define component you should use local variable that starts with an upper-case letter (should be X not x)
  3. instead of type="text/jsx" you shouldletter (should be X not x)
  4. instead of type="text/jsx" you should use type="text/babel" (don't forget include babel)

Example

Ad
source: stackoverflow.com
Ad