1
resposta

O app renderiza mais de uma vez.

O app renderiza mais de uma vez. Não sei como isso é possivel, pois antes de criar os times e chamar o componente team, tava tudo certo. Eu até removi pra ver se era o componente pra ver havia algo de errado, mas continua dando erro. Algo está fazendo o react renderizar mais de uma vez, e eu não tenho mais ideia do que possa ser.

App.jsx:

import { useState } from 'react';
import Banner from './components/Banner';
import RegisterForm from './components/RegisterForm';
// import Team from './components/Teams'

function App() {

  console.log('render')

  const teams = [
    {
      name: 'Programação',
      mainColor: '#57C278',
      backgroundColor: '#D9F7E9'
    },
    {
      name: 'Front-End',
      mainColor: '#82CFFA',
      backgroundColor: '#E8F8FF'
    },
    {
      name: 'Data Science',
      mainColor: '#A6D157',
      backgroundColor: '#F0F8E2'
    },
    {
      name: 'Devops',
      mainColor: '#E06B69',
      backgroundColor: '#FDE7E8'
    },
    {
      name: 'UX e Design',
      mainColor: '#DB6EBF',
      backgroundColor: '#FAE9F5'
    },
    {
      name: 'Mobile',
      mainColor: '#FFBA05',
      backgroundColor: '#FFF5D9'
    },
    {
      name: 'Inovação e Gestão',
      mainColor: '#FF8A29',
      backgroundColor: '#FFEEDF'
    }
  ]

  const [collaborators, setCollaborators] = useState([])

  const onCollaboratorRegistered = (collaborator) => {
    setCollaborators([...collaborators, collaborator])
    console.log(collaborator)
  }

  return (
    <div className="App">
      <Banner />
      <RegisterForm addNewCollaborator={collaborator => onCollaboratorRegistered(collaborator)} teams={teams} />
      

    </div>
  );
}

export default App;

Team.jsx:

import './Team.css'

export const Team = (props) => {
    return (
        <section className='team' style={{backgroundColor: props.backgroundColor}}>
            <h3>{props.name}</h3>
            <hr style={{borderColor: props.mainColor}}/>
        </section>
    )
}

e no console, ele renderiza duas vezes, depois da erro, depois renderiza duas vezes de novo e de novo erro

1 resposta

Olá, Mikael! Tudo bem?

Dá uma olhadinha neste tópico respondido no fórum e veja se isso resolve seu problema. Abraços!