CODEWITHSUNDEEP
javascriptreactjs
VoidCodes
VoidCodes

Reputation: 13

ReactDOM not showing

var ReactDom = require('react-dom')
var createReactClass = require('create-react-class')

//Create new react component
var TodoComponent = createReactClass({
    render:function() {
        return(
            <h1>React component</h1>
        )
    }
})

//Put react component in html page
ReactDom.render(<TodoComponent />, document.getElementById('todo-wrapper'))

This is my current code and its not rendering Im pretty new to react

Upvotes: 1

Views: 79

Answers (1)

dqve
dqve

Reputation: 609

Try this instead, one major flaw with your code that I noticed is you used ReactDom instead of ReactDOM please refer to the react docs for further info on creating class components and rendering them properly

class TodoComponent extends React.Component {
  render() {
    return ( <
      h1 > React component < /h1>
    )
  }
}

//Put react component in html page
ReactDOM.render( < TodoComponent / > , document.getElementById('todo-wrapper'))
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>

<div id="todo-wrapper"></div>

Upvotes: 1

Related Questions