У меня есть форма с кнопкой отправки. Эта форма вызывает функцию onclick, которая устанавливает состояние чего-либо от false до true. Затем я хочу передать это состояние обратно родителю, чтобы, если оно истинно, оно отображало componentA, но если оно ложно, оно представляло componentB.

Как бы я это сделал в реакции? Я знаю, что мне нужно использовать состояние или реквизит, но не знаю, как это сделать. и это противоречит принципу одностороннего потока?

Код компонента:

<form onSubmit={this.handleClick}>


handleClick(event) {
    this.setState({ decisionPage: true });
    event.preventDefault();
  };

Родительский компонент, который управляет тем, что он отображает:

return (
      <div>
      {this.props.decisionPage ?
        <div>
          <LoginPage />
        </div>
        :
        <div>
          <Decision showThanks={this.props.showThanks}/>
        </div>
      }
      </div>
    )