Question

我正在制作某种随机图像生成器，该图像生成器将图像显示在8个不同的行（最大8 * 30 = 240）个随机图像上。

我使用完全相同的for循环一次又一次地输出这些图像8次：

var indents = [];
for (var q=0; q < 30; q++) {
    var rdmNumber = Math.floor(Math.random() * 14) + 1;
    var imgName = "img_" + rdmNumber +".png";
    var src = "img" + "/" + imgName;
    indents.push(<div className="item-picture" key={q}><img src= {src}className="item-img" alt="Your possible winnings" /></div>);
}

var indents2 = [];
for (var w=0; w < 30; w++) {
    var rdmNumber2 = Math.floor(Math.random() * 14) + 1;
    var imgName2 = "img_" + rdmNumber2 +".png";
    var src2 = "img" + "/" + imgName2;
    indents2.push(<div className="item-picture" key={w}><img src= {src2}className="item-img" alt="Your possible winnings" /></div>);
}

等等

对我来说，是否有一种很好的简便方法将所有这些功能整合在一起？重要的是最大数量的图像。所有8行的顺序都不同，这就是为什么我要这样做。

任何帮助将不胜感激。谢谢！

Answer 1

var imgs = 8;
var indents = [];
for (var i = 0; i < imgs; i++) {
    for (var q = 0; q < 30; q++) {
        //Generate image based on i and q variable for unique image
        //push image to indents
    }
}

您可能可以按照CBroe的建议进行操作，并使用2个循环。然后，如果足够，请使用外部循环变量和内部循环变量生成一些唯一数字。

您甚至可以将其拆分为3个可能更好的功能（但您应该自己尝试一下：）

getImage（基于数字获取单个图像）

getImagesForRow（获取一行图像并返回一个数组）

getAllImages（基本上就是我上面写的代码）

需要帮助来简化javascript for loop's

1 个答案: