Maison  >  Article  >  interface Web  >  À quoi devez-vous faire attention lorsque vous utilisez vue.js

À quoi devez-vous faire attention lorsque vous utilisez vue.js

王林
王林original
2020-11-27 17:08:009682parcourir

Points à noter lors de l'utilisation de vue.js : 1. Les filtres sont principalement utilisés pour la conversion de texte simple ; 2. La différence entre les méthodes calculées et 3. L'utilisation de clés ; . L'utilisation des composants ; 6. Communication des composants.

À quoi devez-vous faire attention lorsque vous utilisez vue.js

L'environnement de cet article : windows10, vue2.9, ordinateur Dell G3.

(Partage de vidéos d'apprentissage : tutoriel vidéo javascript)

Vous devez faire attention aux problèmes suivants lors de l'utilisation de vue.js :

1. Les filtres sont principalement utilisés pour des conversions de texte simples. Si vous souhaitez implémenter une transformation de données complexe, vous devez utiliser des attributs calculés

2. Utilisation des instructions

  • v-bind est essentiellement utilisé pour les attributs des éléments HTML, tels que id, class, href, src, etc.

  • v-on est utilisé pour lier les écouteurs d'événements, tels que click, dblclick, keyup , mousemove, etc. Ceci dans la méthode pointe vers L'instance Vue actuelle

  • v-show ne peut pas être utilisé sur le modèle

  • - v- if et v-show scénarios d'utilisation

  • v-if Si la condition est fausse, l'élément de rendu ne sera pas compilé. v-show n'est qu'un simple commutateur de propriété CSS, il sera compilé indépendamment de vrai/faux. v-if convient aux scènes où les conditions ne changent pas fréquemment v-show convient aux conditions de changement fréquentes

3. La différence entre calculé et méthodes

  • les méthodes sont des parenthèses (), calculées sans parenthèses.

  • calculé est basé sur son cache de dépendances et ne sera revalidé que lorsque les dépendances concernées changeront. Lorsque les

  • méthodes sont restituées, la fonction sera toujours rappelée et exécutée.

4. Utilisation des clés

Lorsque Vue rend des éléments, compte tenu de l'efficacité, il réutilisera autant que possible les éléments existants. À ce stade, vous devez ajouter l'attribut clé

<input key="go">

à l'élément réutilisé. 5. L'utilisation des tableaux

  • filter(), concat() et. slice() ne changera pas. Le tableau d'origine renverra un nouveau tableau

  • et remplacera le tableau d'origine par le nouveau tableau sans aucun impact sur les performances. Lors du rendu de Vue, il tentera de réutiliser les éléments DOM

    Certains changements de tableau ne peuvent pas être détectés par Vue et mettra à jour la vue

  • app.books[3]={ }app .books.length=1 Les situations ci-dessus peuvent être gérées en utilisant respectivement Vue.set et app.books.splice(1)

6. Utilisation des composants

6c5c9568e9a11b274400f6ca26034d77, c34106e0b4e09414b63b2ea253ff83d6, 221f08282418e2996498697df914ce4e sont restreintes par HTML et seules les balises de composants personnalisés ne sont pas valides.
À ce stade, vous pouvez utiliser l'attribut is pour monter le composant

<table>    
    <tbody is="my-component"></tbody>
</table>

92cee25da80fac49f6fb6eec5fd2c22a Lors du rendu, il sera remplacé par le contenu du composant my-component

Remarque : Mais lorsque vous utilisez un modèle de chaîne, il n'est pas restreint. Tel que le fichier .vue

7. Communication des composants

  • parent-> $ émettre v-model

  • Recommandations associées :

    Tutoriel js

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn