Explication détaillée de l'utilisation de la liaison bidirectionnelle vue.js

Cette fois, je vais vous apporter une explication détaillée de l'utilisation de la liaison bidirectionnelle vue.js. Quelles sont les précautions lors de l'utilisation de la liaison bidirectionnelle vue.js. un cas pratique, jetons un coup d'oeil.

L'opération de liaison bidirectionnelle la plus basique pour les débutants sur vue.js, le contenu spécifique est le suivant

Introduisez d'abord vue.js et les autres plug-ins qui doivent être utilisés ou peuvent être utilisés sur la page (ici j'ai cité plus de bootstrap et jquery)

Lors de la citation, vous devez faire attention au chemin du fichier Préparation Ceci est pratiquement terminé. Commençons officiellement à commencer.

L'une des fonctionnalités les plus importantes de vue.js est la liaison de données bidirectionnelle, que nous appelons souvent MVVM : Model-View-ViewModel. Si nous voulons obtenir une liaison bidirectionnelle, nous devons bien sûr d'abord avoir "bidirectionnelle". Ici, vue.js nous fournit la couche Vue et la couche Modèle. La couche View est le code en HTML et la couche Model est le code Javascript.

Les positions de début et de fin de la couche de vue et de la couche de modèle sont marquées dans le code.

Dans la couche de vue, nous devons créer une étiquette pour afficher les résultats du programme exécuté dans la couche modèle, et nous devons ajouter une classe ou un ID à cette étiquette. Dans cet exemple, j'ai ajouté un ID nommé app à une étiquette p. .

La couche modèle est le code que nous voulons exécuter. Nous devons d'abord créer un nouvel objet Vue. La valeur correspondant à el dans l'objet est le nom de classe ou le nom d'ID de l'étiquette que nous avons précédemment créée dans la couche de vue (cette étiquette est). la portée de l'objet vue), la valeur correspondant aux données est un autre objet. La clé de cet objet est le code dans "{{}}" dans la couche de vue, et la valeur est le résultat affiché.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment convertir des nombres et des chaînes en JS

Réaliser facilement un graphique carrousel avec 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!