router5 以编程方式导航浏览器历史记录答案

【问题标题】：router5 programmaticaly navigation whith browser historyrouter5 以编程方式导航浏览器历史记录
【发布时间】：2020-08-23 14:07:34
【问题描述】：

我在我的反应应用程序中使用 router5。当我使用链接（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;

【问题讨论】：

标签： reactjs browser-history

【解决方案1】：

我只是从中删除 {replace: true} props.router.navigate('stickers', {id: id}, {replace: true}); 现在它对我有用。有时我们只需要写出我们的问题））

【讨论】：