0

Please be patience, my english is not that good. I am trying to create a for loop to push for each image imported, an object with different values. I want to avoid just setting all the objects i want into the array and try to do it in an optimized way. Any ideas? Here is the code:

/* PNG format */
import client1 from '../assets/images/client1.png';
import client2 from '../assets/images/client2.png';
import client3 from '../assets/images/client3.png';
import client4 from '../assets/images/client4.png';
import client5 from '../assets/images/client5.png';

/* Webp format */
import client1Webp from '../assets/images/client1Webp.webp';
import client2Webp from '../assets/images/client2Webp.webp';
import client3Webp from '../assets/images/client3Webp.webp';
import client4Webp from '../assets/images/client4Webp.webp';
import client5Webp from '../assets/images/client5Webp.webp';

const Clientes = () => {

    const clients = [];

    for (let i = 1; i < 6; i++) {
        clients.push({
            webp: `client${[i]}Webp`,
            img: `client`${[i]}`, /* I thought when this returned "client1" it would take the imported img */
            key: `client${[i]}`
        })
    }

It returns and renders the array as tags.

    return (
        <div>
           { clients.map((client) => {
                return (
                    <picture key={client.key}>
                        <source srcSet={client.webp} />
                        <img src={client.img} alt='cliente'/>
                    </picture>
                )
            })}
        </div>

}

Juan Manuel
  • 1
  • 1
  • Does this answer your question? [Importing multiple files in react](https://stackoverflow.com/questions/44607396/importing-multiple-files-in-react) – Md Wahidul Azam Apr 14 '22 at 18:24
  • https://stackoverflow.com/questions/44607396/importing-multiple-files-in-react – Md Wahidul Azam Apr 14 '22 at 18:25
  • Actually no, i do not care about importing files, but looping to create multiple objects with a word + numbers [i] for eg. I want an array of objects, and for each one of them: client1, client2, client3, client4, etc. How can i achieve this by using something like for... client: `client${[i]}` – Juan Manuel Apr 14 '22 at 18:51

0 Answers0