如何在 ReactJs 应用程序中使用 Google 分析来跟踪事件

Question

我想在我的 reactjs 应用程序中使用 Google 分析来跟踪 link 组件点击。我做了以下步骤：

npm install react-ga --save
从 'react-ga' 导入 ReactGA； ReactGA.initialize('UA-mytrackId');
我的 index.html 有 javascript 代码：
var trackOutboundLink = function(url) { ga('send', 'event', 'outbound', 'click', url, { 'transport': 'beacon', 'hitCallback': 函数(){document.location = url;} }); }

如何跟踪下面我的组件中的点击次数：

import React from 'react';
import { Link} from 'react-router-dom';
const CourseDetail=({course, onCourseSelect})=>{
return (    
   <div>
     {course.SUBJECT} {course.CATALOG_NBR} - {course.COURSE_DESCR} 
     <ViewLink onCourseSelect={onCourseSelect} course={course}></ViewLink>
     <Link  to={{ pathname: '/course/'+course.CLASS_NBR
             
            }}
            target="_blank"
                        key={course.ID} onClick={()=>"ga('create', 'UA-mytrackId'); ga('send',   'event', 'Schedule', 'bookmarksClick', 'bookmarks');"} >
                        Bookmark link
                    </Link>
    </div>  
);
};
export default CourseDetail;

Answer 1

这是将事件发送到 React 中的 Google Analytics 的示例：

const sendOutbound = (event) => {
  event.preventDefault();
  ReactGA.event({
   category: 'Schedule',
   action: 'bookmarksClick',
   label: 'bookmarks'
 });

<a href... onClick={sendOutbound}>
   ...
</a>

如何在 ReactJs 应用程序中使用 Google 分析来跟踪事件

How to Use Google Analytics in ReactJs Application to Track Events

google-analytics

reactjs