------------------------------------------
{ {appel de fonction}}, calculé, montre
{ {function call}} Il sera appelé lorsque la page commencera à se charger, et il sera également appelé lorsque des données de la page changeront. Une fois la page restituée, la fonction se chargera à nouveau sauf en cas de besoin spécifique. , n'utilisez généralement pas
calculé. Les valeurs calculées sont générées en fonction des valeurs existantes. Lorsque la valeur d'une dépendance change, le résultat change. Utilisez généralement ceci.
la montre surveille si une valeur change. Les valeurs simples sont directement surveillées et les valeurs complexes nécessitent une surveillance approfondie (types de données tels que les tableaux et les objets js)
Différence : l'appel de la fonction est appelé lorsque des données de la page changent, et le calcul est appelé uniquement lorsque la valeur dépendante change.
Vous ne pouvez pas écrire de manière asynchrone dans computed, mais vous pouvez écrire de manière asynchrone dans watch.
Comment l'utiliser au travail, utiliser calculé dans la plupart des cas. Dans le cas d'une utilisation asynchrone de watch, tant qu'une donnée change, elle doit être recalculée, à l'aide d'appels de fonction
------------------------
classe
:classe="['div1','div2']"
Variante : class="[a,b]"
a:'div1',
b:'div2'
:class="[vrai?'div1':'',vrai?'div2':'']"
:class="{div1:true,div2:true}"
style
:style="{nom du style : variable}"
exemple de vue
const vm=nouveau Vue({
l'application'
données :{a:1}
méthodes :{show(){}}
})
vm.$el
vm.$données
vm.data
vm.méthode
questions d'entretien
Vue est un framework mvvm javascript progressif, centré sur les données
mvc-mvp-mvvm Ceux-ci ont de nombreuses variantes.
C'est une idée architecturale. Peut être utilisé dans des projets globaux. Il peut également être utilisé seul en front-end ou back-end
fonction de crochet de cycle de vie
Le processus du cycle de vie de l'objet vm de l'initialisation à la destruction
Fonction de crochet À chaque étape importante de l'objet, la fonction qui doit être exécutée est la fonction de crochet
avant la création
Tout nouveau, rien n'a été exécuté $el et $data ne sont pas définis
après la création
Le conteneur $el n'a pas encore été trouvé, mais les données sont liées en premier
avant le montage
Je viens de trouver le conteneur
après montage
Remplacez les données du conteneur par les données de new.
avant la mise à jour
Mis à jour
avant la destruction
après destruction
brancher
Faire une certaine fonction seul. Aider à compléter une petite fonction du projet
module
Fonctions réutilisables Un module est un fichier js
Composants
Un seul bloc composé de html+css+js
Le développement basé sur les composants divise un projet en plusieurs petits morceaux de html + css + js. l'ensemble du projet est composé de plusieurs petits morceaux
Aussi gros qu'un élément, aussi petit qu'un bouton, on peut l'appeler un composant.
modèle de développement du spa
demande d'une seule page demande d'une seule page
Meilleure maintenance et forte réutilisabilité
Définition du composant
composante globale
À définir devant new, tant qu'il est défini, il peut être utilisé n'importe où
Vue.component('nom du composant',{})
composants locaux
uniquement pour usage topique
Composants:{
Nom du composant: {}
}
Utilisation des composants
<nom du composant></nom du composant>
Précautions d'emploi
1. Il doit y avoir une balise racine dans le composant
2. Le type de composant peut être réutilisé
3. Ce n'est pas un problème d'utiliser le composant à étiquette unique seul, mais il est problématique de l'utiliser avec d'autres
4. Il y a en fait toutes les fonctions de Vue dans les données des composants, les méthodes, la surveillance, le calcul et le cycle de vie
Pourquoi les données du composant sont-elles différentes des données du nouveau Vue ? est un retour de fonction{}
Parce que si tous les composants utilisent {}, le même nom de données entrera en conflit et polluera. Utilisez des fonctions pour mettre {} pour placer des données dans différentes portées. Les données dans des portées différentes ne s'affectent pas les unes les autres.
Qu'est-ce que la liaison bidirectionnelle des données ?
Dans Vue, la liaison bidirectionnelle des données consiste à utiliser le détournement de données combiné à la méthode du mode éditeur-abonné, appelez Object.defineProperty() pour détourner le setter et le getter de chaque propriété , et lorsque les données changent Publier des informations aux abonnés. Déclenchez le rappel d'écouteur correspondant.
Qu'est-ce qu'un échafaudage ?
Un outil pour créer rapidement des projets VUE, qui peut générer automatiquement des modèles de projet pour VUE et webpack, et peut installer automatiquement les plugins requis par VUE, évitant l'installation manuelle de divers plugins
Quelle est la différence entre l'importation et l'exportation modulaires de VUE et celles de NODE ?
La principale différence est que les systèmes de modules qu'ils utilisent sont différents.Le
système de modules d'importation et d'exportation ES6 dans VUE est l'importation et l'exportation statiques, qui prennent en charge
l'importation nommée
/ l'exportation par défaut
NODE est le système de modules COMMON.js, qui est chargé dynamiquement et doit être analysé et exécuté au moment de l'exécution.
Les méthodes export module.exports et exports
exigent ont deux fonctions :
1. Chargez le module de fichiers et exécutez le code à l'intérieur
2. Obtenez l'objet d'interface exporté par le module de fichiers chargé
a quoi sert la prise
Dans VUE, les sockets sont un mécanisme de communication des composants. Il permet aux composants parents de transmettre du contenu aux composants enfants sans codage en dur dans les composants enfants. Les slots peuvent être utilisés pour transmettre du HTML, du texte, des composants ou tout autre type de contenu. Dans le composant parent, vous pouvez utiliser la balise <slot> pour définir l'emplacement, et dans le composant enfant, vous pouvez utiliser la balise <slot> pour faire référence à l'emplacement. En utilisant des slots, les composants peuvent être rendus plus flexibles et réutilisables car ils peuvent accepter différents types de contenu et peuvent être utilisés dans différents contextes.
, Pourquoi v-for a-t-il besoin d'ajouter une clé, à quoi sert-il et qu'est-ce qui est recommandé comme clé
Garantissez l'unicité de chaque élément de données et récupérez les données plus rapidement dans les opérations DIFF. Il est recommandé d'utiliser l'ID ou le numéro d'identification comme identifiant unique. Si l'index est utilisé comme clé, cela nous obligera à ajouter et à supprimer des données dans l'ordre inverse, etc., ce qui entraînera des mises à jour réelles inutiles du DOM. Bien qu'il n'y ait aucun problème avec le rendu de l'interface, notre efficacité sera très faible. De plus, il existe un DOM de type entrée dans notre structure, ce qui entraînera de mauvaises mises à jour du DOM et des problèmes d'interface.
4. Que fait le filtre
Filtrer les données qui remplissent les conditions,