React JS：ForEach Function 沒有返回任何東西

Question

我的代碼中有一個 JS function，它應該為拆分字符串的每個元素返回一個 React 組件，但由於某種原因，當我在主“return()”上調用它時，function 沒有返回任何內容。 我試圖將 function 直接放在 return() 中，但同樣的事情發生了。 這從來沒有發生在我身上，我不知道它是什么。

這是我的代碼：

import React from 'react';

import DatabaseLiLine from './DatabaseLiLine';

const DatabaseLiSection = ({ className, children, classId }) => {
    const example = "Use,This,As,An,Example";
    const splitLiTitles = example.split(",");

    const returnLines = () => {
        splitLiTitles.forEach(element => {
            return(
                <DatabaseLiLine>
                    {element}
                </DatabaseLiLine>
            );
        })
    }
    return (
        <li className={className}>
            <a href="/">{children}</a>
            <div id={classId} className="consult_box">
                {returnLines()}
            </div>
        </li>
    );
}

export default DatabaseLiSection;

Answer 1

forEach 不返回任何內容。 更改您的代碼以使用map方法。

    const returnLines = () => {
        splitLiTitles.map(element => {
            return(
                <DatabaseLiLine>
                    {element}
                </DatabaseLiLine>
            );
        })
    }

這里有點腦子放屁，但我忘記了您是否還需要返回 map 方法，例如在 splitLiTitles.map 之前添加return splitLiTitles.map... 。 我認為沒有它它應該可以工作，但如果它不嘗試在前面添加該返回。