Um momento
Aula 16
Cursos / Autenticação com o Firebase, React Native & Redux
Implementação do onChangeText do Campo de Email Através do mapDispatchToProps

Summary

Resumo do Transcript

Neste trecho, estamos discutindo a implementação de um action creator para alterar o email de login em uma aplicação. A seguir, estão os passos principais abordados:

  1. Definição do Action Creator:

    • O action creator, chamado changeLoginEmail, será responsável por processar o texto digitado pelo usuário, que representa o novo email.
  2. Uso de mapDispatchToProps:

    • É necessário injetar o action creator como uma propriedade do componente usando mapDispatchToProps.
    • Pode-se utilizar um atalho, passando um objeto com o nome do action creator (neste caso, changeLoginEmail).
  3. Importação do Action Creator:

    • O action creator deve ser importado de um arquivo chamado actions index.js.
    • O uso do ES6 permite simplificar a destruturação do objeto, não sendo necessário repetir o nome da chave.
  4. Chave do Action Creator:

    • O nome da chave injetada pode ser alterado, mas neste caso, opta-se por manter o mesmo nome changeLoginEmail para simplificação e clareza.
  5. Próximos Passos:

    • O próximo passo é definir a função do action creator dentro do arquivo de ações (actions index.js).

Este processo é uma parte importante do gerenciamento de estados em uma aplicação React, utilizando Redux para a manipulação de ações e estado.

Video Transcript

Então, a gente vai passar com um argumento para o change login email esse texto, dessa maneira, tá bom? O que está acontecendo? Esse cara aqui vai ser o action creator, criador da ação. E quando a gente chamar, vai passar o texto que a gente digitou. Esse cara aqui é o argumento da função de flash, que é a coisa que a gente digitou. E a gente vai mandar uma action que vai ter a coisa que a gente digitou, o texto. E esse cara vai ser pego no af reducer aqui e vai retornar ao novo state com esse cara atualizado, esse email ou o password. Tá bom? Então, vamos definir esse action creator. Primeiro de tudo, ainda que não esteja definido para usar ele como propriedade do componente, a gente precisa injetar usando o map dispatch to props. Nada final, você vai lá e digita o map dispatch to props. Ou você pode usar um atalho que é só passar um objeto com o nome do action creator, change login email, ok? Depois você pode passar o objeto, change login email, que vai ser o quê? Esse aqui vai ser a chave que será injetada como props e vai ser o change login email que a gente vai importar. Vamos importar esse cara. Import o quê? Change login email. Eu vou destruturar o que a gente vai fazer assim. Vamos... Vai estar dentro do actions index, tá bom? A gente vai fazer assim. Vamos botar index, não precisa digitar index. E assim. Esse cara a gente não definiu ainda, mas vai estar dentro do actions index.js, tá bom? Então, esse cara, change login email, vai ser esse aqui, tá? E vai ser injetado como essa chave aqui. Esse aqui poderia ser qualquer nome. Poderia ser esse negócio aqui. Queria chamar esse cara, tá bom? E a gente vai ser ID quando queria chamar esse, por exemplo, algo. Se eu botar o nome algo, eu tenho que chamar aqui dentro, desco, props, algo, tá bom? Nesse caso eu não quero, eu quero o seu mesmo nome, então vou voltar o mesmo nome. Change login email. Como eu estou usando a versão s6, eu não preciso digitar se o valor for o mesmo do propriedade do objeto. Então, vou tirar assim, porque é muito melhor. Tá bom? Esse aqui é o atalho pro map dispatch to props. Vamos definir esse action creator agora. Vou para o index do actions aqui, tá bom? Vamos lá definir qual é o nome da função. Vamos lá export. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá. Vamos lá.
Nenhum comentário ainda (loading...)
Nenhum comentário ainda (loading...)
Gostou da aula? 😆👍
Apoie nosso trabalho com uma doação: