Могу ли я использовать matchPath без дочернего компонента?

Question

Допустим, у меня есть этот компонент с myCurrentState со значением 0. И я хотел бы изменить его на 1, когда меня направляют на ConfirmComponent (/), и обратно на 0 при маршрутизации обратно к * 1003.* (/ verify)

class MySpecialComponent extends Component {
  constructor() {
    super();
    ...
  }
}

state = {
  myCurrentState: 0,
};

<Router>
  <div>
    <Route
      path="/"
      render={() => <RootComponent />}
      exact
    />
    <Route path="/confirm" render={() => <ConfirmComponent />} />
  </div>
</Router>

Большинство примеров (matchPath, match), которые я смог найти, были примерами с добавлением кода в дочерние компоненты.Но я хотел бы сделать все это в этом главном MySpecialComponent компоненте.

Может ли кто-нибудь дать мне примеры, если это возможно, и если да, то как:)?

Answer 1

Как мы уже говорили в комментариях, если вы можете добавить код в дочерний процесс, это возможное решение

class MySpecialComponent extends Component {
  constructor() {
    super();
    ...
  }

changeValue = (value) => {
  this.setState({myCurrentState: value});
}

state = {
  myCurrentState: 0,
};

render = () => <Router>
  <div>
    <Route
      path="/"
      render={() => <ConfirmComponent updateParentState={() => this.changeValue(1)}/>}
      exact
    />
    <Route path="/confirm" render={() => <RootComponent updateParentState={() => this.changeValue(0)} />} />
  </div>
</Router>;
}

К вашему сведению, я думаю, что в вашем примере компоненты Root и Confirm могут быть перепутаныв зависимости от того, что вы хотите сделать.

В дочерних компонентах

class RootComponent extends Component {
  constructor(props){
    super(props)
    this.props.updateParentState(); //updates state of parent
  }
  ...
}
class ConfirmComponent extends Component {
  constructor(props){
    super(props)
    this.props.updateParentState(); //updates state of parent
  }
  ...
}