Reactjs 从容器传递click处理程序的正确方法，它不会'；不改变状态？

我正在使用React和Redux

我有一个横幅组件，其中横幅显示在旋转木马中

我有连接到redux的

Banner.js

和作为组件的

Banner.js

点击旋转木马，我需要做两件事

将用户重定向到另一个url的

启动GTM事件

上述操作都不会修改状态。我应该通过mapDispatchToProps从容器中传递onClick处理程序吗

---

正确的方法是什么？

如果不需要分派任何操作，我认为不需要在mapDispatchToProps中传递函数。BannerContainer中的本地功能应该足以满足您的需求。顺便问一下，什么是GTM活动？我不知道缩写。

我仍然会在connect中传递它，因为这是不应该隐藏在组件树中的业务逻辑。否则，如果您需要更改GTM材料或更改路线，则必须找到组件

创建一个执行副作用的thunk action creator，并使用

mapDispatchToProps

对其进行映射。如果您的组件不是顶级路由组件，则可以使用

with router

访问路由上下文。您甚至可以将装饰器或增强器组合到容器中：

import { connect, compose } from 'redux'
import { withRouter } from 'react-router'
import YourComponent from '../components/YourComponent'

// your dispatch
const mapDispatchToProps = (dispatch, ownProps) => {
  return {
    onBannerClick(e){
       //do your GTM stuff
       //redirect the user!
       ownProps.history.push('/gohere')
    }
  }
}

// combine your enhancers, order is significant if you want
// to have withRouter() props in your connect methods
const enhance = compose(
   withRouter(),
   connect(mapStateToProps, mapDispatchToProps),
)

export default enhance(YourComponent)

---

Google Tag Manager（GTM），我们在其中触发事件进行跟踪。那么这个本地函数，我应该将它作为道具传递给组件吗？像

？