Aula 25
Curso React: Componentes Controlados
Summary
Resumo da Transcrição
Na transcrição, o autor discute passos para implementar e alterar a exportação de componentes em um projeto de desenvolvimento, provavelmente usando JavaScript ou uma biblioteca como React.
Principais Pontos
- Teclas de Atalho: O autor menciona um atalho para Windows ou Linux, pedindo ajuda aos ouvintes para confirmar.
- Estrutura de Componentes: Um comentário sobre esquecer de criar uma "hard list".
- Listas e Exportações:
- Mudar os padrões de exportação de componentes como
checkbox list
,hard list
, eselect
. - Usar "desestruturação" para facilitar o código.
- Mudar os padrões de exportação de componentes como
- Importação: Sugestão para importar todos os componentes necessários de uma só vez, utilizando um arquivo
index.js
dentro da pastacommons
.- Isso permite que um único import conte com todos os elementos necessários.
Recapitulando Mudanças
- Criar um arquivo
index.js
que exporta todos os componentes, facilitando as importações no futuro. - Utilizar
export
de objetos, tornando o código mais limpo e organizado. - O mesmo nome para propriedades e valores nas exportações permite um código mais conciso.
Conclusão
O autor finaliza agradecendo por assistir, menciona seu Twitter e oferece um link para o código fonte do projeto no GitHub.
Nota: A conversa parece ser relacionada a desenvolvimento de software e práticas de programação, especialmente focando em componentes de UI.
Video Transcript
talvez no Windows ou Linux seja Control Shift D
quem souber, deixa o comentário por favor
então vamos lá
esqueci o hard list
vamos ver, tem checkbox, checklist
esqueci o hard list
agora vamos mudar cada um desses caras
primeiro checkbox list, lá no final
em vez de default, muda todos os defaults e retorna o objeto
exporta um objeto
input text
vamos lá
um hard list
e o select
ajeita o export
e o index
mas senão como mudamos a maneira de exportar cada um
o checkbox list e o hard list
vamos lá
em cima tem o import checkbox
agora tem que ser com esse cara
destruturamento
senão a gente tinha que direitar como assim
essas coisas
entendeu
vamos lá
salva, vai para o radio list
vou esperar você ajeitar
deu tudo certo
adicione as chaves
salva
terminamos isso, vamos para o formulário
vamos usar esse cara aqui
vamos comentar esses outros só para ver
antes de deletar, vamos ver se não deu erro
input text, checkbox list, radio list, from, módulo
importar esses caras dentro do common
então dá import, cada componente que vai precisar
do formulário do
pasta chamado commons, como a gente tem o arquivo
chamado index.js, é opcional de digitar aqui
ele já sabe que vai ser o index
vamos ver se deu tudo certo
o que é isso aqui, eu esqueci de salvar alguma coisa
salva o index, salvei
vamos lá testar
deu tudo certo
então é isso
recapitulando o que a gente fez
vamos remover aqui
nosso objetivo era poder
usar somente um import
para que contasse
que contem todos os componentes que serão necessários
no formulário
em vez de fazer import cada um
linha por linha
da maneira de fazer isso, cria index.js
exporta cada componente
exporta tudo, o chamado estrela
exportstar
cada componente tem que exportar como um objeto
em vez do export default
exporta o próprio componente
exporto o objeto, propriedade
tem o mesmo nome que o valor, por isso a gente não precisa digitar esse
é a mesma coisa
mas para ser conveniente, mesmo nome
obrigado por assistir
e não se esqueça
estou no twitter
vamos nos falar lá
e o código fonte para esse projeto está no meu github
nbkhope, barra componentes controlados
opa
vala e dê uma olhada
obrigado, valeu
Nenhum comentário ainda (loading...)
Nenhum comentário ainda (loading...)
Gostou da aula? 😆👍
Apoie nosso trabalho com uma doação: