reactjs - Router を使用した兄弟コンポーネント関数の呼び出し

Question

ルーターを使用する前は、NewContactPage から [Done] をクリックして、ContactsPage の add 関数を呼び出し、リストに新しい人物を追加することができました。

  <div>
    <ContactsPage ref={instance => { this.contacts = instance; }} />
    <NewContactPage handleSubmit={e => this.contacts.add(e) } />
  </div>

ルーターでは、通信がどのように機能するかわかりませんが、

  <Router>
    <div>
      <Route exact path="/" component={ContactsPage} />
      <Route path="/add" component={NewContactPage} />
    </div>
  </Router>

ソースコード: https://codesandbox.io/s/upbeat-architecture-xww2c

どうもありがとう！