反应路由器dom和重定向未添加到历史记录?

大纲:

我目前正在尝试学习react/redux/router。作为一个实践项目,我正在开发一个基本的联系人/客户管理应用程序。使用react路由器domsRedirect组件时。我无法使后退/前进导航按预期工作

详细信息:

我有一个表,其中包含位于/contacts/的条目列表,当您单击其中一个表行时,我想使用设置的值重定向;tr&gts onClick属性

单击<tr key={d.\u id}onClick={()=>this.setState({id:d.\u id})}&gtstate.id更改为clientIDs唯一值。这将导致表呈现方法中的重定向为true,从而触发重定向

render(){//render方法的'/contacts/'{contacts}组件
返回(
…//桌头
{this.state.id&&<重定向到={”//contacts/card/“+this.state.id}/>}
…//表内容
)
}

这是位于父App.js

render(){
返回(
<BrowserRouter basename=“/”>
<div>
<导航栏/>
<主>
<开关>
<路由精确路径=“/”组件={Login}/>
<路线
精确路径=“/contacts”组件={contacts}/>
<路线
准确的
path=“/contacts/card/:clientID”组件={ContactCard}/>
</Switch>
</main>
</div>
</BrowserRouter>
);
}

问题:

重定向后,如果单击/contacts/card/:clientID中的后退按钮,浏览器不会返回到/contacts/。取而代之的是,它在我所看到的任何以前的:clientIDURL中循环

我已尝试包装<tr&gt<链接到={}&gt标记,但它破坏了样式

警告:this.state.id

我知道我应该使用Redux来保存重定向函数的this.state.id值。我还没有完全掌握如何用一个redux reducer管理多个值。一旦我这样做了,我会用适当的方法更新这个问题

找到答案后,我需要将推送添加到我的<重定向/&gt这样的组件

<将推送重定向到={`/contacts/card/${this.state.id}`/>

从文档中:

<重定向/&gt

推送:bool

如果为true,重定向将在历史记录上推送一个新条目,而不是替换当前条目

发表评论