首页 > 解决方案 > 里面的 ReactJS 代码

{...}
不渲染

问题描述

我正在尝试在其中生成列表及其项目<div>,但由于某种原因,代码没有呈现。

<div>
 {
   sarasas.map((obj, key) => {
    console.log("cia irgi")
      return (
        <ul>
         <li>{obj.vardas}</li>
         <li>{obj.pavarde}</li>
         <li>{obj.data}</li>
         <li>{obj.klase}</li>
         <li>{obj.info}</li>
         </ul>
       )
   })
 }
</div>

div 显示,但里面的所有内容都没有。这是组件的一部分。其他一切正常,我什至不知道如何解决这个问题。该数组不为空,其中的所有对象都具有所有值。连console.log作品都没有。

编辑:我曾经console.log查看数组是否充满了对象:

const sarasas = []

const updateStudentInfo = () => {
    for(let i = 0; i < localStorage.length; i++){
        storedItems = JSON.parse(localStorage.getItem(i))
        sarasas.push(storedItems)
    }
    
    console.log(sarasas)
}

它表明数组中有 3 个对象sarasas

标签: javascriptreactjs

解决方案


请试试这个

演示:-

<div>
{
    sarasas?.map((obj) => (
         <ul>
           <li>{obj.vardas}</li>
           <li>{obj.pavarde}</li>
           <li>{obj.data}</li>
           <li>{obj.klase}</li>
           <li>{obj.info}</li>
        </ul>
    ))
}
</div>

推荐阅读