@cmall/cmall-ga4 NPM

chicv cmall ga4 模块

使用

import GA4 from '@cmall/cmall-ga4'

const {ga4_id, site_name} = setting // from setting api

// SSR or window.onload 时需要初始化安装。、
// CSR 的路由跳转不需要重复调用
GA4.getInstance(ga4_id, site_name).init()

// demo add to cart click 
$('.add-to-cart').on('click', () => {
  GA4.getInstance(ga4_id, site_name).logAddToCart({
      // ...
    })
})

类型

CollectDataItem

interface CollectDataItem {
  /** sku 编号 */
  skuCode: string;
  /** 商品名称 */
  productName: string;
  /** 商品所在列表的位置，没有就传1 */
  index: number;
  /** 商品所在列表的id */
  belongCollectionId?: string | number;
  /** 商品所在列表的名称 */
  belongCollectionName?: string;
  /** 商品价格 */
  price: number;
  /** 商品SkuId, 也是变体variant */
  skuId: number;
  /** 商品数量, 默认上报1 */
  quantity?: number;
  /** 商品品类列表， 可以同时所属多个品类 */
  categories: string[];
}

函数

init() : void
初始化安装
logAddToCart(collectData: CollectDataItem): void
加购
logRemoveFromCart(collectData: CollectDataItem): void
移除购物车
logAddToWishList(collectData: CollectDataItem): void
添加心愿单(收藏)
logViewCart(collectDatas: CollectDataItem[]): void
查看购物车
logClickRecommend(event_label: string): void
推荐词点击
logClickFilter(event_label: string): void
点击筛选器
logClickSort(event_label: string): void
点击排序
logViewItemList({item_list_id: string, item_list_name: string, items: any}): void
商品列表曝光，此函数不需要手动调用，通过函数挂载到 window.viewItemList, 由自埋点模块发起调用
logSelectItem(collectionId: string, collectionName: string, collectData: CollectDataItem): void
选择商品
logClickViewMoreButton({event_label: string, item_id: string, item_name: string}): void
点击“更多”按钮
logViewItem(collectData: CollectDataItem): void
单个商品查看
logClickHeaderLogo(): void
头部 logo 点击
logClickHeaderCurrency(currency = 'USD'): void
点击头部币种切换
logClickHeaderDomainIcon(domain: string): void
点击头部域名切换
logClickHeaderLanguageIcon(lang = 'USD'): void
点击头部语言切换
logClickLoginIcon(login_way: string): void
点击头部登陆
logClickAccountIcon(label_name: string): void
点击头部用户图标
logClickCartIcon(): void
点击购物车图标
logClickCloseCart(): void
点击关闭购物车
logClickButtonInCart(label: string): void
点击购物车内的按钮
logClickNavLink(name: string[]): void
点击导航链接
logClickFooter(event_label: string): void
点击页面底部按钮
logClickSearchKeyWorld({event:label: string, search_term: string}): void
点击搜索关键词
logSignUp(): void
注册
logBeginCheckout({coupon: string, collectDatas: CollectDataItem[]}): void
开始结算
logAddShippingInfo({currency: string, value: string, coupon: string, items: CollectDataItem[], shipping_tier: strign}): void
选择物流方式
logAddPaymentInfo({currency: string, value: string, coupon: string, items: CollectDataItem[], payment_type: string}): void
选择支付方式
logClickHomeViewMoreButton(): void
首页的点击“更多”按钮