将GA事件添加到可重复使用的React组件

Question

使用可重用组件构建反应网页。现在问题出现在添加GA事件中，因为GA事件主要是页面特定事件，并且反应组件可重用。将GA事件应用于此的最佳方式是什么？例如：假设Card组件是相当可重用的，我已经在我的Home Page中使用了它。 GA活动将像('Home Page','Card Click','Card No')一样。但如果我在其他地方使用Card组件可以说User Page，那么首页的GA事件将被调用，而不是这是错误的。相反，用户页面事件应该被调用。我该如何解决这个问题？

我能想到的一种方法是在页面特定的JS中分别添加单击事件监听器并调用事件。但是，这将导致多个点击处理程序（假设卡也有点击事件）。有什么更好的建议吗？

Answer 1

为什么不通过上下文通过props和点击广告的处理器也可以是这个样子：

handleClick() { 
    ga('send', 'event', this.props.pageContext, 'Card Click', 'Card No'); 
} 

这就是通常情况下是如何处理的反应。