我是reactjs的新手。我的问题对于反应开发者来说可能非常简单,但我想在这个论坛上得到一些帮助。
我有两个不同的页面,一个是路由配置页面,另一个是链接页面,我正在尝试加载另一个重定向到购物车页面的组件,该页面显示购物车中的项目列表。因此,默认模块是主页(app.js),它必须重定向到购物车页面。
我正在使用react router v1.0。
路线配置页面:(app.js)
React.render((<Router>
<Route path="/" component={FluxShoppingCart}>
<IndexRoute component={FluxShoppingCart}/>
<Route name="cart" component={ViewCart} />
</Route>
</Router>),document.getElementById('container'));
链接页面:( Flux Cart Component)
<Link to="cart"><button type="button" className="btn btn-default btn-sm">Cart {totalCartItems}</button></Link>
两者都在不同的页面中。现在,当我试图点击正在更新url的Cart按钮时,还有一些查询参数。在默认情况下加载其显示
http://localhost:8080/#/?_k=exw21r
并与推车链接显示
http://localhost:8080/#/cart?_k=xme60o
任何人都可以通过纠正我的代码/分享一些资源(博客/视频)来帮助我解决这个问题。我需要加载默认组件,点击购物车按钮后,它必须重定向到另一个组件。我在互联网上检查了很多例子,显示在同一页面上使用不同的组件,但我在不同的页面中使用。请只做那些需要的。提前谢谢。
答案 0 :(得分:6)
history模块添加一个唯一的查询字符串,以便在使用基于sessionStorage
的历史记录时,可以将每个历史记录项与window.location.hash
中的某个状态相关联。
它的文档讨论了这一点,并向您展示了退出它的一半解决方案:
另一半是将历史记录实例传递给Router
。
var createHashHistory = require('history/lib/createHashHistory')
// Opt out of persistent state query key for for hash history
var history = createHashHistory({queryKey: false})
<Router history={history}>...
您还需要将history
添加到您自己的依赖项中。