Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
O problema dessa aula (depois do problema do formData) é a inclusao e as viagens que aoSubmeter faz... que surge "do nada" como atributo no app.jsx e viaja como parametro e vai terminar dentro de aoFormSubmetido. Se ninguem reforça a regra de ouro do react de pai => filho ninguem entende nada. O claude me salvou, até aqui. O prof é ótimo, mas não há tempo para aprofundar temas importantes. 100% entendido amemmmmmmmmm
Vale olhar o caminho que o projeto fez até aqui, porque ele explica o aoSubmeter melhor do que qualquer definição.
Desde que a gente parou de escrever HTML solto e começou a quebrar a tela em componentes, todo componente novo veio recebendo props. E os valores foram ficando mais complexos, um degrau por vez.
Começou com texto entre as tags: Botao e TituloFormulario recebendo children. Depois string em atributo: Label com htmlFor. Depois objeto: Tema recebendo tema e lendo o .nome dele. Depois array: ListaSuspensa recebendo itens pra montar as option. Depois objeto mais complexo: CardEvento recebendo evento inteiro e usando capa, data, título e tema.
Quando o board precisou ganhar vida, veio o último degrau: uma prop carregando uma função.
<FormularioDeEvento
temas={temas}
aoSubmeter={adicionarEvento}
/>
Duas props, mesma sintaxe, mesma direção. Uma leva um array, a outra leva uma função. O temas você já tinha visto meia dúzia de vezes antes — e o aoSubmeter está do lado dele, na mesma chamada.
Repara que adicionarEvento está sem parênteses. Não estamos executando ela ali. Estamos passando ela, do mesmo jeito que fizemos com o array logo acima.
Isso é JavaScript: função é valor. Guarda em variável, passa como argumento, devolve de outra função. Sem isso, aoSubmeter={adicionarEvento} parece mágica — e não é.
Então ele não surge do nada, e não viaja pra lugar nenhum. É a mesma função vista de dois pontos. No App ela se chama adicionarEvento. Dentro do formulário, atende por aoSubmeter.
Dado desce, de pai pra filho, via props. Não tem exceção aqui.
O que acontece quando o filho precisa avisar o pai de alguma coisa? O pai manda uma função pra baixo, e o filho chama quando precisa falar.
// dentro do aoFormSubmetido
aoSubmeter(evento)
O formulário diz "montei um evento, toma". Só isso. Ele não sabe que existe useState do outro lado, não sabe que existe lista, não sabe o que vem depois.
E é bom que não saiba. É isso que permite plugar esse mesmo formulário em outra tela amanhã.
aoé convenção de nome:aoSubmeter,aoClicar,aoMudar. Versão em português doonSubmit,onClick,onChangeque você já viu no HTML. Bateu o olho numaoou numonnuma prop, tem função ali dentro.
map, find, ...rest, evento versus eventos, e agora função passada como argumento
Nenhuma vez um conceito de React.
No post anterior eu deixei duas indicações, amarradas exatamente nesses pontos — escopo, métodos de array, função como valor, FormData, eventos, formulários. Não sei se você chegou a olhar.
E o projeto não para de subir a escada. O próximo trecho já usa filter e some pra decidir quais temas aparecem na tela e quais somem. Mais método de array, mais função sendo passada como argumento.
Sempre que precisar, posta aqui no fórum - eu sempre procuro estar atendo e ajudar!
Bons estudos!
Eu tive MUITA DIFICULDADE com essa introdução a REACT mas finalmente cheguei a aula de estado de componente sem nenhuma duvida em relação ao codigo inteiro escrito até aqui, mas foi dificil. Só fiquei agarrado por 30min até entender: quando introduz a renderização dinamica dos eventos, com map, e altera o evento={eventos [0]} para evento={item} key={indice}, me complicou, porque vc comenta que o map tem sempre dois parametros, o item atual e o index, mas ai eu olho ali pro map de temas, e recordo que ele tem so um parametro, o item atual, dai da aquele bug basico, 30min de agarrado kkkkkkkkkkkkkk MAS, lembro que o temas tem id. Voce comenta perfeitamente sobre esse assunto, mas acho que eu tenho um delay até amarrar tudo. To bem satisfeito porque estou terminando esse projeto sem um rastro de duvida, eu agarro mas não deixo passar uma duvida sequer kkk obrigado, abs
E esse video que trata de imutabilidade eu nao tenho muita duvida porque no começo desse projeto eu fui buscar mais informações de react e acabei vendo um video seu sobre useState, com um formulario, e já sabia que esse push ia ser substituido pelo set. Perfeito, depois de muito sofrimento kk obrigado