Handlebars中如何通过变量{{my-index}}获取数组{{page.myArray}}的指定元素？

嘿，我之前也踩过这个坑！Handlebars在处理动态数组索引的时候确实有点 tricky，你试的那两种写法都没踩对点子上，我来给你捋捋正确的做法：

核心问题 #

你之前用的{{page.myArray.[my-index]}}或者嵌套花括号的写法都不对——Handlebars的模板语法里，直接用点加方括号的方式没法识别变量索引，它会把[my-index]当成一个字面量的索引字符串，自然拿不到正确的元素。

两种可行的解决方案 #

1. 使用内置的lookup助手（最稳妥，兼容所有版本）

Handlebars专门提供了lookup助手来处理动态索引的场景，用法超级简单：

{{lookup page.myArray my-index}}

• 第一个参数是你的目标数组page.myArray
• 第二个参数是存储索引的变量my-index
  这个助手会帮你根据变量里的索引值，精准取出数组对应的元素。

2. 直接使用方括号语法（适用于Handlebars v4.0+）

如果你用的是较新版本的Handlebars，可以去掉数组和方括号之间的点，直接写：

{{page.myArray[my-index]}}

注意这里没有.在myArray和[my-index]之间，新版本的Handlebars已经支持这种直接解析变量索引的写法了。

举个实际例子验证 #

假设你的数据结构是这样的：

{
  page: {
    myArray: ["草莓", "蓝莓", "树莓"]
  },
  "my-index": 2
}

用上面两种写法，都会输出树莓，完美符合预期！

内容的提问来源于stack exchange，提问作者L. Berger