How to add multiple icon to an array-CodePudding

I have an array simply like this

const data = {
products: [
{
   name: 'example1',   
   icon: <exampleIcon />,
},
{
   name: 'example2'
   icon: <exampleIcon2 />
},
],
};

I'm using icons from React Icons

Is it possible for me to add multiple icons to the icon part? like three icons in a row like this exampleIcon exampleIcon exampleIcon

CodePudding user response：

you should be able to put multiple icons inside a react fragment

icon: <><exampleIcon /> <exampleIcon2 /></>,

CodePudding user response：

Yes you can, just wrap your components into a root div like this:

const data = {
  products: [
    {
      name: 'example1',
       icon: <div className="wrapper"><exampleIcon /><exampleIcon /><exampleIcon /></div> ,
    },
    {
      name: 'example2',
       icon: <exampleIcon2 />
    },
  ],
};

Add this style:

.wrapper {
  display: flex;
}