首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

在react-redux connect()中,连接的-react-router push()不会更改位置

在react-redux中,connect()函数用于连接React组件与Redux store。它是一个高阶函数,接受两个参数:mapStateToProps和mapDispatchToProps。

  1. mapStateToProps:这个函数定义了组件需要从Redux store中获取哪些状态,并将其映射到组件的props中。它接收一个state参数,表示整个Redux store的状态树,然后返回一个对象,该对象包含组件所需的状态属性。
  2. mapDispatchToProps:这个函数定义了组件需要触发哪些Redux action,并将其映射到组件的props中。它接收一个dispatch参数,用于触发Redux action,然后返回一个对象,该对象包含组件所需的触发action的方法。

在连接了react-redux的组件中,我们可以使用props来访问Redux store中的状态和触发Redux action。但是,这个连接并不会直接影响到React Router的导航。

-react-router是一个用于处理前端路由的库,它提供了一种在单页面应用中切换视图的方式。其中的push()方法用于将新的URL添加到浏览器历史记录中,并导航到该URL对应的页面。

在react-redux中,connect()函数只是用于连接组件与Redux store,并不会直接影响到-react-router的导航。如果想要在Redux action中实现导航功能,可以使用react-router提供的withRouter()高阶组件来包装连接后的组件,然后在Redux action中使用props.history.push()来实现导航。

综上所述,connect()函数和-react-router的push()方法是两个独立的概念和功能,它们在不同的领域和场景中使用。在使用react-redux时,我们可以通过connect()函数连接组件与Redux store,然后使用props来访问状态和触发action;而在使用-react-router时,可以使用push()方法实现前端路由导航。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • 尝试 React 17 RC / Demo of Gradual React Upgrades

    前一段时间,React团队发布了 React 17 RC [1],对于这个版本,官方说的是没有新特性,可以称作是一个 “垫脚石” 版本,为以后的版本更新做准备。主要是因为之前的 “all-or-nothing” 升级策略遇到了问题:一方面React团队要一直维护老旧的并且使用较少的API;一方面开发者在面对React版本升级时,往往需要升级整个项目,这意味较高的风险,特别对于很老旧的项目(哈哈,估计到时候很多人都会吐槽~)。所以提供了一个 渐进升级 的方案,那 React 17 就是使得 渐进升级 变得更加容易!为此还更改了 React 的事件代理模式。这篇文章是对官方提供的 渐进升级 的例子 Demo of Gradual React Upgrades [2],表述一下自己认为它是如何工作的。

    03
    领券