Implementação do código
Event
Click
Exemplo de código utilizando o evento de click:
run() {
// On execute...
$router.push("/visao-geral")
},
O código acima está utilizando uma funcionalidade do router (roteador) da biblioteca/framework em questão para direcionar o usuário para a rota "/visao-geral". Isso significa que, quando esta função for chamada, o navegador será redirecionado para a página ou componente correspondente à rota "/visão-geral".
Mount
Exemplo de código utilizando o evento de mount:
init() {
// On mounted...
effect(() => {
this.styles.color = $route.pathname == "/home" ? "#0A65B8" :"#7E808F"
})
},
O código acima está definindo a cor de algum elemento visual (estilo CSS) com base na rota atual da aplicação. Se a rota atual for "/home", a cor será definida como "#0A65B8", caso contrário, será definida como "#7E808F"
Erros Comuns:
No this.styles precisa ser em CamelCase, por exemplo this.styles.backgroundColor = '#FFF'.
Os eventos de componente rodam mais de uma vez, deve se fazer uma trava personalizada para chamar somente uma vez, além de que não pode assiná-lo como assíncrono pois não há suporte e nem msm na callback do effect.
Os componentes de ícones não funcionam dinamicamente, são estáticos, não é possível alterá-los pelo código no apk.
Se o código da tela principal estiver com problemas e você precisar de informações dela, mas as outras telas também estiverem com problemas, pode ser difícil rastrear e depurar os erros de forma eficaz. Isso ocorre porque, geralmente, um erro na tela principal só se torna aparente quando todos os seus componentes filhos, ou seja, as outras telas ou elementos dentro dela, estiverem funcionando corretamente. Assim, se houver um problema em uma tela secundária, por exemplo, isso pode mascarar o erro na tela principal, tornando-o mais difícil de identificar e corrigir.