• • 此问题在此处已有答案**：

When should I use a return statement in ES6 arrow functions（6个答案）
11小时前关门了。
我想创建一个函数renderItems，这样就可以将其插入到return中，但它不起作用。如果将此函数插入到return中，则在控制台中显示未定义。所有函数都起作用，但我不想这样做。

import React, { useState } from "react";
import { useEffect } from "react";
import PostService from "../../API/PostService";
import Loading from "../loading/Loading";
import "./ItemList.css";

export default function ItemList() {
    const [peopleList, setPeopleList] = useState();
    const [items, setItems] = useState();

    const postService = new PostService();

    useEffect(() => {
        postService.getAllPeople().then((peopleList) => {
            setPeopleList(peopleList);
        });
    }, []);

    const renderItems = (arr) => {
        arr.map(({ id, name }) => {
            return (
                <li className="list-group-item" key={id}>
                    {name}
                </li>
            );
        });
    };

    return (
        <div>
            {!peopleList ? (
                <Loading />
            ) : (
                <ul className="item-list list-group">
                    {console.log(renderItems(peopleList))}
                </ul>
            )}
        </div>
    );
}