Terminologia Básica no Redux
Nesta lição, vamos revisar brevemente os conceitos e termos fundamentais, cujo domínio é necessário para o estudo posterior do Redux.
Começaremos com a ação (action).
Este é um evento que
descreve o que aconteceu em nossa
aplicação. Tecnicamente, é um simples
objeto JavaScript,
contendo um campo type, no qual escrevemos
o nome da ação.
O segundo campo importante do objeto de ação
é o campo payload.
Ele conterá a carga útil
da ação. Por carga útil entende-se
alguns dados que são passados
como parâmetros para a ação.
Também podem existir outros campos neste objeto com informações adicionais.
Vamos criar uma ação como exemplo
e chamá-la de addOrderAction. Vamos supor que
ela seja responsável por adicionar um pedido.
Isso significa que na propriedade type indicaremos que
o pedido foi adicionado (orderAdded) aos pedidos
(orders). E em payload especificaremos mais detalhes,
que pedido é, por exemplo - pintar
uma parede:
const addOrderAction = {
type: 'orders/orderAdded',
payload: 'Paint a wall'
}
Para não precisar escrever o objeto
de ação manualmente todas as vezes, podemos usar
o chamado action creator - uma função
que irá criar e retornar
o objeto de ação para nós. Vamos chamá-la de
addOrder. Como parâmetro,
passaremos a ela o texto desejado para
a propriedade payload:
const addOrder = text => {
return {
type: 'orders/orderAdded',
payload: text
}
}
O próximo conceito importante na cadeia é o reducer (redutor) - uma função que recebe o estado atual e o objeto de ação. Esta função decide como atualizar o estado e retorna o estado já atualizado, se necessário.
O próximo conceito é o armazenamento (store) - este é o objeto onde o estado global atual da aplicação Redux é armazenado. Este objeto possui um método getState, com o qual se pode obter o valor atual do estado.
O armazenamento também possui o método dispatch. Chamá-lo e passar o objeto de ação - esta é a única maneira de alterar o estado. Como resultado, a store executará a função redutora e salvará o novo valor do estado nela mesma.
E o último conceito que veremos nesta lição são os seletores. Seletores são funções especiais, que sabem como extrair informações do estado localizado no armazenamento. Essas funções são particularmente úteis quando a aplicação cresce e ajudam a evitar repetição de código.
Veremos mais detalhes sobre todos esses conceitos e sobre a sua aplicação prática nas próximas seções deste tutorial.
