无法使用 Typescript、Function 组件和 React-hooks 进行反应跟踪

Question

我正在将 react.js 与 typescript、react-hooks 和函数组件一起使用。在 prem 上工作，我不能使用 google 分析或新遗物等云跟踪解决方案。另外 - 由于许可问题，我无法购买本地跟踪服务器解决方案 - 所以我必须实施自己的解决方案。我偶然发现了反应跟踪，它默认写入 window.dataLayer[]（对于 google 分析）但应该允许更改它 - 所以我尝试了下面的代码。但是 - 它对我不起作用 - 没有调用 handleTracking - 我怎样才能让它工作并通过给它一些有意义的数据（目前我只是通过点击测试......）提前Tnx

import React, { useEffect, useContext, useState }  from 'react';
import { Button } from 'semantic-ui-react';
import { observer } from 'mobx-react-lite';
import track, { useTracking } from 'react-tracking';

const JobDashboard: React.FC = () => {
    const { trackEvent } = useTracking();
    const rootStore = useContext(RootStoreContext); 
    const { trackData} = rootStore.jobStore;

    const handleTracking = (trackingData) => {
        //trackData(trackingData);
        console.log(trackingData)
    }

    return (
    <Grid >
        <Grid.Column width={10}>
        <Button
                onClick={() => {
                    trackEvent({ event: 'click-test', dispatch: data=> {handleTracking(data)} });
                }}
                floated="right"
                content="Track"
                color="blue"
            />
        </Grid.Column>
    </Grid>
);
}

export default track({ page: 'JobDashboard' })(observer(JobDashboard));

Answer 1

import React, { useEffect, useContext, useState }  from 'react';
import { Button } from 'semantic-ui-react';
import { observer } from 'mobx-react-lite';
import track, { useTracking } from 'react-tracking';

JobDashboard: React.FC = (track(
  // app-level tracking data
  { app: "JobDashboard" },
  {
    dispatch: data => {
      console.log(data);
      (window.dataLayer = window.dataLayer || []).push(data);
    }
  }
  return (
    <Grid >
        <Grid.Column width={10}>
        <Button
                onClick={() => {
                    trackEvent({ event: 'click-test'} 
                });
                }}
                floated="right"
                content="Track"
                color="blue"
            />
        </Grid.Column>
    </Grid>
);
)(export default observer(JobDashboard));

无法使用 Typescript、Function 组件和 React-hooks 进行反应跟踪

Can't get react-tracking to work with Typescript, Function components and React-hooks

reactjs

typescript

react-hooks

mobx

event-tracking