本文讲解如何利用 handlebars 的 `lookup` 辅助函数与 `@index` 数据变量，实现在单次 `{{#each}}` 循环中同步访问多个同长度数组的对应元素，从而正确生成含“标题+旧值+新值”的对比表格。
在 Handlebars 模板中，{{#each}} 默认仅作用于当前上下文（如 header 数组），无法直接访问同级的其他数据（如 previous 或 current）。若想让每一行
关键点在于：
- @index 是 {{#each}} 循环内置的数据变量，表示当前迭代项的数组下标（从 0 开始）；
- ../previous 表示向上一级作用域查找 previous 数组（因 {{#each header}} 将上下文切换为 header 元素，需用 ../ 回退）；
- {{lookup ../previous @index}} 等价于 JavaScript 中的 previous[@index]，实现按索引安全取值。
以下是完整可用的模板代码：
| BEFORE | AFTER | |
|---|---|---|
| {{this}} | {{lookup ../previous @index}} | {{lookup ../current @index}} |
⚠️ 注意事项：
- 三个数组（header、previous、current）必须长度一致，否则 lookup 在越界时返回 undefined，渲染为空单元格；
- lookup 是 Handlebars 4.0+ 内置辅助函数，低版本需手动注册或升级库；
- 若数组项为对象（如 {name: 'Jason'}），可组合使用：{{lookup (lookup ../previous @index) 'name'}}；
- 避免在模板中进行复杂逻辑判断；如需容错（例如某数组缺失），建议预处理数据或封装自定义 helper。
此方案简洁、声明式强，无需修改 JavaScript 数据结构，也无需嵌套循环，是 Handlebars 中多数组对齐渲染的标准实践。
