点击错误".forEach is not a function"

Question

我对javascript还很陌生，当点击按钮时，我正试图从data.js文件加载JSON。JSON被存储为变量CCD_ 1
我确信我还需要进行其他更改才能正确地附加到html文件中，但我目前试图解决的问题是以下错误

未捕获类型错误：large_traits[0]。forEach不是函数

我的HTML如下：<button onclick="loadChar()">Submit</button>。

这是我的javascript函数：

function loadChar() {
large_traits[0].forEach((trait, traitDict) => {
charList = d3.select("characteristics")
charList.append("li")
.classed("char-columns", true)
inputTag = charList.append("input")
.attr("type", "checkbox")
.attr("id", traitDict.id)
.attr("name", traitDict.name)
.attr("value", traitDict.value)
inputTag.append("label")
.attr("for", traitDict.name)
.text(traitDict.name)
})}

我正在尝试将每个JSON对象加载到一个li中，其中包含一个用于用户输入的复选框。

当我console.log变量large_traits时，它会在控制台中返回以下内容：0: active: {id: "active", name: "active", value: "active", size: "large"} adaptable: {id: "adaptable", name: "adaptable", value: "adaptable", size: "large"} affectionate: {id: "affectionate", name: "affectionate", value: "affectionate", size: "large"} agile: {id: "agile", name: "agile", value: "agile", size: "large"} alert: {id: "alert", name: "alert", value: "alert", size: "large"} aloof: {id: "aloof", name: "aloof", value: "aloof", size: "large"}

感谢您的帮助。

Answer 1

我猜只是访问数组的第一个元素，而不是数组本身。尝试：

function loadChar() {
large_traits.forEach((trait, traitDict) => {
charList = d3.select("characteristics")
charList.append("li")
.classed("char-columns", true)
inputTag = charList.append("input")
.attr("type", "checkbox")
.attr("id", traitDict.id)
.attr("name", traitDict.name)
.attr("value", traitDict.value)
inputTag.append("label")
.attr("for", traitDict.name)
.text(traitDict.name)
})
}

Answer 2

使用console.log，您的large_traits[0]似乎是一个对象

所以试试：

Object.entries(large_traits[0]).forEach(([trait,traitDict]) =>