I keep trying to finish my solution for this tutorial and the screen freezes before I can test my code. An error message pops up saying the page is unresponsive.
Welcome there,
Would you mind sharing your code?
It is likely you are causing an infinite loop, by rendering a component within itself.
I am not sure how much contextual code to give, but:
class ParentComponent extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<div>
<h1>I am the parent</h1>
{ /* Change code below this line */ }
<ParentComponent>
<ChildComponent/>
</ParentComponent>
{ /* Change code above this line */ }
</div>
);
}
};
Oh man, I will try that again, I didn’t realize I needed to format it differently
you are adding the parent component inside itself, so it creates an infinite loop and the browser crashes. Remove ParentComponent from the render method of ParentComponent
I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.
You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.
See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').
Thank you so much, I have so much to learn and appreciate the feedback!
Think of components as functions. Calling a function inside itself is recursion and if the recursion doesn’t have a base case (the condition that stops the recursion) it is infinite.
The same goes for component props, think of them as function parameters and arguments.
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.