React JS + google 标签管理器：如何在页面转换时触发数据层

Question

我在 React 应用程序中尝试将数据发送到 GTM（谷歌标签管理器）时遇到问题。我们已经设法在相关页面上放置了不同的脚本。

例如下面是我们放入购物车页面的脚本之一：

class Cart extends Component {

  render() {
    const { cartItems } = this.props;
    return (
      <script
        dangerouslySetInnerHTML={{ __html: `
          window.dataLayer = window.dataLayer || [];
          window.dataLayer.push({
            event: 'viewCart',
            cartItems: ${cartItems}
          });
          window.history = window.history || [];
          window.history.pushState({
            page: 'Current Cart Page',
            events: 'viewCart',
            cartItems: ${cartItems},
          }, 'Current Cart Page');
        ` }}
      />
    );
  }
}

当我们从另一个页面（EG：主页）访问购物车页面时，上面的脚本不会执行，但是当我们刷新页面时，它会被触发。

事实证明，数据层只推送pageLoad和DOMReady事件。但不在historyChange

有没有人遇到过这个问题并知道如何解决？