Изображение отображается только один раз, даже если оно возвращается из цикла, который должен вернуть его 50 раз

Question

Я пытаюсь визуализировать изображение, используя цикл for в компоненте реакции, но цикл работает не так, как ожидалось. Изображение отображается только один раз, когда я вызываю функцию, которая должна визуализировать одно и то же изображение 50 раз и показывать 50 изображений на экране

import React from 'react';
import dipesh from '../../dipesh.jpg';

export default function Tshirt() { 
    let renderTshirt = () => { 
        for(let i=0; i < 50; i++) {
            return( <img src={dipesh} alt="pic"/> )
        }
    }
    return ( <div> {renderTshirt()} </div> )
}

Answer 1

Попробуйте код ниже:

import React from 'react';
import dipesh from '../../dipesh.jpg'; 

export default function Tshirt() {
 let renderTshirt = () => {
    let tShirtList = [];
    for(let i=0; i<50; i++){ 
      tShirtList.push( <img src={dipesh} alt="pic"/> );
    };
    return tShirtList;
 }
 return ( <div> {renderTshirt()} </div> ) 
}

Надеюсь, это решит вашу проблему.