Ramonda

state-written-while-rendering

This fails the run. Where it is wrong about your code, // ramonda-check-ignore <reason> on the line says so, and the reason is printed on every run.

Reported when a state write is reached from render() or a @compute — directly, through a helper it calls, or three files away.

The framework reports the same fault while running, as RMD001 and RMD018 — but only once the line actually runs. This is the same fault proved from the source instead.

render() and @compute answer one question: given this state and these props, what does the component look like. A write while answering it makes the answer depend on how many times it was asked, and the framework asks whenever it likes — so a render schedules a render, which either loops or settles on whatever the last pass happened to leave.

Move it to where the change belongs: an event handler, @mounted, @updated, or a @watchProp if it follows a prop. If the value is derived from state you already have, it is a @compute and does not need to be written at all.

A function written as a JSX attribute is NOT reported: onclick={() => this.n++} is a handler, and that is exactly where writing state is right.

Next