программная навигация по маршрутизатору 5 с историей браузера

#reactjs #browser-history

#reactjs #браузер-история

Вопрос:

Я использую router5 в своем приложении react. Когда я использую ссылку (компонент router5) для перехода со страницы на страницу, это работает правильно. Но когда я использую программный переход к своему маршруту, браузер не запоминает предыдущее состояние.

 import React, {useState} from "react";
import './StickerItem.css'


const StickerItem = ({id, name, props}) =>{
    let [select , setSelect] = useState(false);

    function toggleSelect() {
        props.stickerToggleSelectAC(id);
        select ? setSelect(false) : setSelect(true);
    }

    function routeSticker() {
        /* this code don't save transition from  route to route */
        props.router.navigate('stickers', {id: id}, {replace: true});
    }
    
    return <div onClick={toggleSelect}
                onDoubleClick={routeSticker}
                className={"link_sticker"   " "   (select? "active" : "")}
                key={id}> {name} </div>
    
    /* this code works correct and i can navigate from page /stickers/18 to /stickers/40 and forward  in my browser*/
    
    // return <Link    routeName="stickers"
    //                 routeParams={{id}}
    //                 activeClassName="active_link_sticker"
    //                 className={"link_sticker"   " "   (select? "active" : "")}
    //                 key={id}> {name} </Link>
};


export default  StickerItem;
  

Ответ №1:

Я просто удалил {replace: true} из props.router.navigate('stickers', {id: id}, {replace: true}); , и теперь это работает у меня. Иногда нам нужно просто записать наши проблемы))