Javascript 如何映射和返回localStorage中的项目？

我当前在本地存储中有项，当前在本地存储中的数据的console.log如下所示：

我想简单地映射这些项目并呈现标题。我原以为下面的代码可以工作，但没有显示任何内容，并且没有错误消息。你知道我做错了什么吗？多谢各位

import React, { useState, useEffect } from 'react';
import './../App.css';
import * as ReactBootStrap from 'react-bootstrap';
import {Link} from 'react-router-dom';

function Cart() {

const storageItems = JSON.parse(localStorage.getItem('product'));
console.log(storageItems)

    return (
      <div className="App">
          {storageItems.map((item) => {
            <p>item.title</p>
          })}
      </div>
    );
}

export default Cart;

import React，{useState，useffect}来自“React”；
导入“/../App.css”；
从“react bootstrap”导入*作为react bootstrap；
从'react router dom'导入{Link}；
功能车（）{
const-storageItems=JSON.parse（localStorage.getItem（'product'）；
console.log（storageItems）
返回(
{storageItems.map（（项）=>{
项目名称

})}
);
}
导出默认购物车；

尝试：

  {storageItems.map((item) => (<p>{item.title}</p>))}

{storageItems.map（（item）=>（{item.title}
）}

因为您没有返回jsx，请尝试：

  {storageItems.map((item) => (<p>{item.title}</p>))}

{storageItems.map（（item）=>（{item.title}
）}

---

因为您没有返回jsx

，所以无法从

map（）

返回。在

项的周围用括号替换大括号。title

storageItems.map（（item）=>（
{item.title}
）

可以正常工作。如果您创建了一个元素数组，请使用具有唯一id的键道具……或者完全去掉大括号，它就会工作。您不会从

map（）

返回。在

项的周围用括号替换大括号。title

storageItems.map（（item）=>（
{item.title}
）

可以正常工作。如果你创建了一个元素数组，请使用带有唯一id的关键道具……或者完全去掉花括号，它就会工作。