React - Render a Class Component to the DOM

JavaScript
1

Tell us what’s happening:

Describe your issue in detail here.
I have tried to get this challenge right and always come up with the same error!
The error I am getting is
// tests completed
// console output
Uncaught ReferenceError: ReactDom is not defined
act(…) is not supported in production builds of React, and might not behave as expected.
[TypeError: Cannot read properties of undefined (reading ‘innerHTML’)]

Your code so far

class TypesOfFood extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <div>
        <h1>Types of Food:</h1>
        {/* Change code below this line */}
        <Fruits />
        <Vegetables />
        {/* Change code above this line */}
      </div>
    );
  }
};

// Change code below this line
ReactDom.render(<TypesOfFood />, document.getElementById("challenge-node"));

class TypesOfFood extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <div>
        <h1>Types of Food:</h1>
        {/* Change code below this line */}
        <Fruits />
        <Vegetables />
        {/* Change code above this line */}
      </div>
    );
  }
};

// Change code below this line
ReactDom.render(<TypesOfFood />, document.getElementById("challenge-node"));

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36 Edg/119.0.0.0

Challenge Information:

React - Render a Class Component to the DOM

2

This line has a typo in “ReactDom,” which should be “ReactDOM.” It’s not the correct way to call the ReactDOM.render function, which is used to render a React component into the DOM.

3

Thanks for the reply and help. I got it now going on to next challenge

1 Like
4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.