Cette fois, je vais vous présenter la différence entre utiliser une méthode et être calculé dans Vue. Quelles sont les précautions lors de l'utilisation d'une méthode et calculé dans Vue. Voici un cas pratique. regarder. .
Les calculs et les méthodes dans les paramètres de configuration du nouveau Vue peuvent gérer une grande quantité de code logique, mais quand utiliser quel attribut, vous devez distinguer soigneusement pour utiliser vue correctement.
calculated est appelé un attribut calculé. Comme son nom l'indique, le calcul doit renvoyer un résultat de calcul. Par conséquent, lorsque nous avons besoin de traiter beaucoup de logique, mais lorsque nous voulons obtenir le résultat final, nous pouvons utiliser calculée
<.> Afin d'illustrer la différence entre méthode et calculé, je voudrais d'abord jeter un œil à ce que dit l'attribut calculé sur le site officiel de Vue : les Regardons un exemple :<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="javascript/vue.min.js"></script> </head> <body> <p id="app"> //直接在模板中绑定表达式 <p>{{message.split('').reverse().join('')}}</p> //运用计算属性 <p>message反转之后的结果:{{reverseMessage}}</p> </p> <script> var vm=new Vue({ el:"#app", data:{ message:"hello" }, computed:{ reverseMessage:function(){ return this.message.split('').reverse().join(''); } } }) </script> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="javascript/vue.min.js"></script> </head> <body> <p id="app"> <p>{{message}}</p> //直接在模板中绑定表达式 <p>{{message.split('').reverse().join('')}}</p> //运用计算属性 <p>{{reverseMessage}}</p> //运用methods方式 <p>{{methodMessage()}}</p> </p> <script> var vm=new Vue({ el:"#app", data:{ message:"hello" }, computed:{ reverseMessage:function(){ return this.message.split('').reverse().join(''); } }, methods:{ methodMessage:function () { return this.message.split('').reverse().join(''); } } }) </script> </body> </html>
Les deux méthodes sont également très différentes en matière de 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 :
Explication détaillée de la requête http de Vue2.0 et de l'utilisation de l'affichage de chargement
le processus du nœud et les modules child_process Explication détaillée de l'utilisation
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!