Sometimes, we may run into to fix the ‘Maximum update depth exceeded error’ when developing React apps.

In this article, we’ll look at how to fix the ‘Maximum update depth exceeded error’ when developing React apps.

Fix the ‘Maximum update depth exceeded error’ When Developing React Apps

To fix the ‘Maximum update depth exceeded error’ when developing React apps, we should make sure no code is keeping the component from re-rendering without stopping.

One common source of the error is that we called a function when we pass in a prop instead of passing in a function reference.

For instance, instead of writing:

{<td><span onClick={toggle()}>Details</span></td>}

We should write:

{<td><span onClick={toggle}>Details</span></td>}

so that toggle is called only when we click on the span.

Conclusion

To fix the ‘Maximum update depth exceeded error’ when developing React apps, we should make sure no code is keeping the component from re-rendering without stopping.

One common source of the error is that we called a function when we pass in a prop instead of passing in a function reference.