在反应中显示数组数据。输出没有来

Question

当我在下面的控制台中打印 console.log(response.data) 时，输出即将到来。

我创建了一个挂钩 const [result,setResult] = useState([]);

然后API的输出我设置为

setResult(response.data);

当我在下面编写代码时，它只是在打印 " Data is"。它不打印 result

的输出

              <h1>
                  Data is
               {
                   result.map((res:any)=>{
                       {res.id};
                   })
                }    

              </h1>

我做错了什么？

Answer 1

你代码的整个逻辑没问题。您正在正确使用 useState 挂钩。您传递给状态的数据是一个数组，可以与 map() 方法一起正常工作。我看到的唯一问题是您的 map() 方法没有很好地实现。

试试这个：

<h1>
  Data is
  {
   result.map((res:any)=>{
      return <p>{res.id}</p>
   })
  }    
</h1>

map() 方法总是 return 的东西。如果是单行，则无需键入 return.

<h1>
  Data is
  {
   result.map((res:any) => res.id )
  }    
</h1>

要打印对象的多个属性：

<h1>
  Data is
  {
   result.map((res:any) => {
      return [
        <div key={res.id}>
           <p>{res.id}</p>
           <p>{res.name}</p>
           <p>{res.createdAt}</p>
        </div>
      ]
   })
  }    
</h1>

在反应中显示数组数据。输出没有来

displaying array data in react. output is not coming

javascript

arrays

user-interface

reactjs

react-hooks