Why can't you call this.setState() from inside of the .render() method?

Why can't you call this.setState() from inside of the .render() method?

• A. It would trigger another render, causing an infinite loop.
• B. Because render runs after the component is mounted.
• C. setState is only allowed in event handlers.
• D. React blocks state updates in render.

Answer: (A)

Calling a state update inside render creates an infinite loop. render is meant to be a pure function that simply reads the current props and state and returns the UI. If you call this.setState during rendering, you schedule a new render, which then calls setState again, and so on, so React keeps re-rendering forever. That’s why you should avoid any state changes in render and instead update state in response to events or in lifecycle methods (like after a component mounts or after it updates). Other options aren’t correct because render isn’t restricted to event handlers, and React doesn’t block state updates in render by design; the real issue is that updating state during render triggers a never-ending render cycle.

Calling a state update inside render creates an infinite loop. render is meant to be a pure function that simply reads the current props and state and returns the UI. If you call this.setState during rendering, you schedule a new render, which then calls setState again, and so on, so React keeps re-rendering forever. That’s why you should avoid any state changes in render and instead update state in response to events or in lifecycle methods (like after a component mounts or after it updates).

Other options aren’t correct because render isn’t restricted to event handlers, and React doesn’t block state updates in render by design; the real issue is that updating state during render triggers a never-ending render cycle.