Transformadores
Last updated
Last updated
Os transformadores são projetados para transformação de dados e reutilização de seu código JavaScript multilinha. Os dados de consultas ou componentes podem não atender às suas necessidades em cenários de negócios. Além disso, você pode usar o mesmo bloco de código várias vezes em um aplicativo. Nesses casos, um transformador é o que você precisa.
Comparado com o código embutido em {{ }}
, o transformador suporta blocos de código multilinha. E, diferentemente da consulta JavaScript, o transformador foi projetado para realizar operações somente leitura, o que significa que você não pode acionar uma consulta ou atualizar um estado temporário dentro de um transformador.
Clique em + Novo > Transfromer em um editor de consultas para criar um transformador.
Em seguida, escreva seu código JS no transformador. Você pode clicar em Visualizar para obter o valor de retorno e acessá-lo por nomeDoTransformador.value
em seu aplicativo.
No exemplo a seguir, transformador1
usa os dados de classificação por estrelas em avaliacao1
para calcular uma pontuação.
{{ }}
não é permitido dentro de um transformador ou consulta JS. {{ }}
é usado apenas para fins de expressão JS de linha única, enquanto um transformador ou consulta JS é para múltiplas linhas de código JS.
Use o método moment().format()
para transformar formatos de data/hora. O exemplo a seguir converte o valor de data/hora de tempo_inicial
retornado por consulta1
para o formato DD/MM/YYYY
.
Use o método _.orderBy()
fornecido por lodash para classificar os dados. O exemplo a seguir retorna consulta1.data
classificado pela coluna quantidade
em ordem crescente.
O código de exemplo abaixo mostra como unir os resultados da consulta de usuarios
e pedidos
usando o ID do usuário.
Somente operações somente leitura são permitidas dentro de um transformador. Isso significa que você não pode definir valores de componentes ou estados temporários, nem acionar consultas. Para essas operações, use consultas JavaScript.
Por exemplo, você não pode chamar o método setText()
de um componente de texto em um transformador.
Em vez disso, chame o método setText()
em uma consulta JavaScript não reporta nenhum erro.
Em outro exemplo, o transformerordernador1
visa classificar os dados de consultarUsuarios
por primeiro_nome
, mas o método sort()
pode alterar os dados originais, então ocorre um erro.
Neste caso, use o método _.orderBy()
fornecido por lodash.