Question

在Next JS中，我的代码看起来像这样：

function Test() {
    return (
        <section>
            <div>Test</div>
        </section>
    );
}

但是，假设我想在这里有多个通过代码生成的条目。我本质上是想用预先计算的HTML替换<section>的内容。这是我尝试过的：

function Test() {
    let posts;
    for (let i = 0; i < 3; i += 1) {
        posts += <div>Test</div>;
    }
    return (
        <section>{posts}</section>
    );
}

但是，这只是产生了输出[object Object][object Object][object Object]，这不是我想要的。我曾尝试用引号和坟墓将HTML括起来，但这是行不通的。我真的不知道该怎么做。

Answer 1

+仅连接字符串；您需要使用.push()或.map()将元素对象存储在数组中。调用它时，将打印出整个数组的内容。

此代码将起作用：

function Test() {
    const posts = [];
    for (let i = 0; i < 3; i += 1) {
        posts.push(<div>Test</div>);
    }
    return (
        <section>{posts}</section>
    );
}

将HTML存储在变量中以供以后在Next JS中使用

1 个答案: