Динамическое изменение URL запроса на выборку при обновлении состояния в React

Question

Я сейчас работаю в проекте, который мне нужен API для визуализации контента.Однако мне нужно сделать еще один запрос, если пользователь меняет язык.Таким образом, чтобы реализовать это динамически, я вставил в конце URL-адреса состояние с именем «langPage» (потому что только API изменится только в API), как вы можете видеть ниже:

componentDidMount(){
    let urlData = 'https://beta.estudiocru.com/wp-json/wp/v2/pages/'+ this.state.langPage;
    console.log(urlData);
    fetch(urlData)
    .then(response => response.json())
    .then(response => {
      this.setState({
        aboutContent: response,
      })
    });

    let logoURL = 'https://beta.estudiocru.com/' + this.state.lang + 'wp-json/wp/v2/acf/options';
    fetch(logoURL)
    .then(res => res.json())
    .then(res => {
      this.setState({
        options: res
      })
    });
  }

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

Я только начинаю реагировать.Я был бы очень признателен, если бы кто-нибудь смог мне помочь.

Спасибо !!

Answer 1

Вы можете переместить выборку на componentDidUpdate(), она будет работать каждый раз, когда изменяется состояние или реквизит.

componentDidUpdate(prevProps, prevState, snapshot) {
   if(this.state.lang !== prevState.lang) {
       // fetch ...
   }
}