O que é uma diretiva vue e como usá -la?
Uma estrutura visa fornecer esses recursos que facilitam e mais rápidos o processo de desenvolvimento para os desenvolvedores. Vue.O JS é uma estrutura JavaScript tão enriquecida com recursos que fornece muitas funções e diretrizes integradas para tornar rapidamente o processo de desenvolvimento. Mas, deve chegar alguns cenários quando você precisar de alguma funcionalidade que não esteja disponível pela estrutura, então você precisa construir seu próprio.
Neste post, aprenderemos e daremos uma olhada nas diretivas internas fornecidas pelo Vue.Estrutura JS, e também aprenderemos a criar e usar nossa própria diretiva de vue feita sob medida.
Diretivo
Diretivas são atributos que você pode vincular aos elementos DOM, prefixados pela cláusula "V-", que ajuda a conhecer a biblioteca de que é um tipo especial de sintaxe usada para executar algumas tarefas. As diretrizes são geralmente usadas para manipulação direta de DOM. Algumas das diretivas mais usadas e famosas são "V-IF", "V-For" e "V-Show".
As diretivas são usadas para aplicar efeitos nos elementos DOM, mas reativamente. Vamos entender com um exemplo:
Diretiva "V-IF"
Você pode ver o texto.
Na tag acima, o "V-IF" é uma diretiva que excluirá ou adicionará a tag de parágrafo "
", Depende da veracidade da variável" ShowText ".
Diretiva "V-Show"
Da mesma forma, temos a diretiva "V-Show" que pode executar a mesma funcionalidade descrita acima:
Você pode ver o texto.
A diferença sutil entre "V-IF" e "V-Show" é que "V-IF" não renderiza o elemento enquanto carrega a página se a variável ligada não for verdadeira e carrega quando a variável se torna verdadeira. Por outro. Portanto, "V-IF" é o tempo eficaz no tempo de carregamento da página e no tempo quando a variável se torna verdadeira. Ele tem que renderizar todo o elemento enquanto o “V-S-SHOW” é o tempo eficaz na veracidade da variável demorada no tempo de carregamento da página da web.
Tudo bem! Vamos dar uma olhada em uma diretiva que leva o argumento.
Diretiva “V-Bind”
Outra diretiva mais usada é "V-Bind", que é usada para interagir e atualizar os atributos HTML. Por exemplo, se queremos vincular alguma variável ao atributo "href" da tag, podemos vincular o atributo "href" como este:
Diretiva "V-On"
Assim como a diretiva "V-Bind", a Vue fornece uma diretiva "v-on" para vincular a variável para ouvir os eventos disparados no DOM. Por exemplo, para ouvir o evento de clique e vincular alguma variável a ele, a sintaxe seria assim:
Nas vírgulas invertidas, podemos fornecer a expressão e também as funções.
Conclusão
Aprendemos sobre as diretrizes em Vue e ver como usar as diretrizes em Vue.JS. Discutimos algumas das diretivas mais usadas e básicas de Vue.JS, que ajuda muito e economiza uma quantidade enorme de tempo no desenvolvimento.