如何在单次data layer push事件中为GTM同一变量捕获多个不同值

你当前的写法属于在单个JS对象内声明重复键名，不符合JS语法规则：同一对象内的重复键会被后续赋值直接覆盖，最终push到dataLayer的对象里仅会保留最后一个tN的取值，部分场景下还会出现键值解析异常，所以GTM读取时会出现返回undefined、拿不到全量值的问题。

1. 调整前端dataLayer推送逻辑 #

把同一变量的多个值存入数组后再推送，有两种常用写法：

写法1：同键值直接存为数组 #

适合仅需要收集该变量多个值的场景：

dataLayer.push({
  event: 'launch_immerse',
  tN: ['greetings', 'family kinship']
  // 其余自定义参数
});

写法2：多组数据存为对象数组 #

适合表格类多字段多组数据的场景，扩展性更强：

dataLayer.push({
  event: 'launch_immerse',
  tableData: [
    {tN: 'greetings', 其余字段1: '对应值1'},
    {tN: 'family kinship', 其余字段1: '对应值2'}
  ]
});

2. GTM侧创建对应自定义变量 #

不要用普通的Data Layer变量，需要创建自定义JavaScript变量来读取全量值：

对应写法1的变量配置 #

• 先创建一个普通Data Layer变量，命名为DLV - tN，指向键名tN
• 新建自定义JavaScript变量，代码如下：

function() {
  // 返回tN的全量值数组，异常情况返回空数组避免报错
  return {{DLV - tN}} || [];
}

对应写法2的变量配置 #

• 先创建一个普通Data Layer变量，命名为DLV - tableData，指向键名tableData
• 新建自定义JavaScript变量，代码如下：

function() {
  var tableData = {{DLV - tableData}} || [];
  // 提取所有组的tN值存入数组返回
  return tableData.map(function(item) {
    return item.tN;
  });
}

如果需要返回字符串格式而非数组，可以在返回值后加.join(',')，即可得到逗号分隔的所有取值。

验证注意事项 #

• 绑定变量的触发器必须指定为launch_immerse事件触发，确保读取动作发生在dataLayer推送之后，避免返回空值
• 可以在GTM预览模式下的Data Layer面板确认推送的参数结构是否符合预期

内容的提问来源于stack exchange，提问作者Jason Starkey