javascript - .map 不是函数 - 反应

Question

我正在尝试映射 API 响应，但它给了我“TypeError：response.map 不是函数”。

我认为这可能是由于 map 方法获取的是字符串而不是数组。但是当我console.log给我一个数组时，我真的看不出错误来自哪里。

或者我可能以错误的方式访问 API 响应数组。

我已经阅读了大量的文档和线程，但仍然无法理解我做错了什么。

提前致谢

{status: {…}, outputs: Array(1), rawData: {…}}
   outputs: Array(1)
    0:
     created_at:"2018-08-24T19:58:44.351091715Z"
     data:
      concepts:Array(20)
       0:{id: "ai_69gDDQgl", name: "hamburger", value: 0.9955255, app_id: "main"}
       1:{id: "ai_QLn2rxmZ", name: "lettuce", value: 0.9920815, app_id: "main"}

const IngredientsList = ({ response }) => {
    const items = response.map((item) => 
<ul>{item}</ul>)
    return (  
        <div>
            <p>{items}</p>
        </div> 
    )
}

标签： javascriptarraysreactjs

Answer 1

这会在列表中呈现带有名称和值的概念数组吗？

const IngredientsList = ({ response }) => {
    if (!response || !response.outputs) {
        return null;
    }
    const items = response.outputs[0].data.concepts.map((item) => <li>name: {item.name}, value: {item.value}</li>);
    return (  
        <div>
            <ul>{items}</ul>
        </div> 
    )
}