javascript - 使用 map 在 React 上进行 2 次循环后添加类

Question

我正在尝试在 2 次循环后添加类。它可以工作，但无法隐藏 {x++} 文本。怎么能隐藏这个呢？我也尝试过使用索引。

const workdata = this.state.worksData.map((work, index) => (
            <div
                className={
                    x % 3 == 0
                        ? "col-lg-4 col-md-6 offset-lg-0 offset-md-3"
                        : "col-lg-4 col-md-6"
                }
                key={index}
            >
                <div
                    className={
                        x % 3 == 0 ? "single-box" : "single-box with-line"
                    }
                >
                    <span>{work.position}</span>
                </div>
                {x++}
            </div>
        ));

使用 for 循环，它可以工作。

for (let i = 0; i < data.length; i++) {
        if (x % 3 == 0) {
            console.log("Class", data[i]);
        } else {
            console.log(data[i]);
        }
        x++;
    }

Answer 1

您应该使用现有的索引属性而不是创建新的 x。请参阅下面的示例代码

const workdays = this.state.worksData.map((work, index) => (
            <div
                className={
                    (index + 1) % 3 == 0
                        ? "col-lg-4 col-md-6 offset-lg-0 offset-md-3"
                        : "col-lg-4 col-md-6"
                }
            >
                <div
                    className={
                        (index + 1) % 3 == 0 ? "single-box" : "single-box with-line"
                    }
                >
                    <span>{work.position}</span>
                </div>
            </div>
        ));