[Tutorial] Potentially confusing explanation of how a component rendering is triggered

I'm new to React and when learning, I first went through the tutorial and then went through the docs. In the tutorial I didn't quite understand why we absolutely have to use the setState() method. But when going through the Using State Correctly and then the API docs for setState() I understood why. Then I went back to the tutorial to see why I couldn't get this from the tutorial. State is introduced in the Making an Interactive Component section.

I think it'd be better if it's explicitly mentioned here that state changes are what causes components to be re-rendered and hence, one shouldn't attempt to modify state directly. The following part particularly is what gave the wrong impression I think. I took this to mean that it's events such as onClick that triggers a rendering.

By calling this.setState from an onClick handler in the Square’s render method, we tell React to re-render that Square whenever its <button> is clicked.

チュートリアルの「Making an Interactive Component」セクションを、リンクされている「Using State Correctly」および「setState() API」のドキュメントと併せて確認してください。引用されている説明に注目し、改訂後の文章がクリックイベントと状態の変更を明確に区別していることを確認してください。新人が、なぜ setState() がレンダリングをトリガーするのか、またなぜ状態を直接変更してはいけないのかを理解できれば完了です。