Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

114
Visualizações
How to dynamically generate id for function components?

Hi I am creating my first application in React. The application generates css styles. It consists of components like border radius, box shadow etc. The components can be combined with each other. Variables from each component are sent via redux to an array and then rendered. I would like to add the possibility of choosing any components and combining them with each other. My problem is with component id. I don't know how to generate id dynamically depending on components order. I need it to update array in redux. There will be an option to delete any components there, so I can't type this statically. I tried to do it using map(), but each component has a different name and I have no idea how to do it. Is it even possible?

Thanks in advance and sorry for my English

const components = [<Transform id={0} />, <BorderRadius id={1} />];
const renderComponents = components.map((component, index) => component);
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

I don't recommend you to map different components, but if you really have to, wrap it in a fragment like this.

const components = [<Transform />, <BorderRadius />];
const renderComponents = components.map((component, index) => (
  <React.Fragment id={index}>
   {component}
  </React.Fragment>
));

See more about fragments here

https://reactjs.org/docs/fragments.html

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda