реагировать на рендеринг компонента, но не всей страницы

Question

Я пытаюсь повторно отобразить один компонент на моей веб-странице в ответ, и у меня возникли проблемы. Когда я нажимаю кнопку «Назад», я хочу перейти к разделу, который в алфавитном порядке предшествует текущему - я разбиваю разделы моего компонента на буквы. Так что моя функция handleBack должна перерисовать компонент. Это мой код ниже:

function handleBack() {
    const currentId = window.location.href.split('/').pop();

    const backId = String.fromCharCode(currentId.charCodeAt() - 1);

    return(

       <Route>

         <Redirect from={'/form/${currentId}'} to={'/form/${backId}'} />

       </Route>);

}

Он знает, что currentID - это B, а backID - это, например, A, но он не перерисовывает компонент и не отображает страницу A. Почему это происходит? Как это исправить? Я думал, что перенаправление и маршрутизация будут работать, но это ничего не делает.

Answer 1

Первый

Измените это на ....

function handleBack() {
    const currentId = window.location.href.split('/').pop();

    const backId = String.fromCharCode(currentId.charCodeAt() - 1);

    return(

       <Route>

         <Redirect from={'/form/${currentId}'} to={'/form/${backId}'} />

       </Route>);

}

На ...

function handleBack() {
    const currentId = this.props.match.params.id; // Use the route params instead of using window.location

    const backId = String.fromCharCode(currentId.charCodeAt() - 1);

    this.props.history.push('/form/${backId}');

}