Maison >interface Web >js tutoriel >Où en est-il lorsque vue utilise axios ?

Où en est-il lorsque vue utilise axios ?

php中世界最好的语言
php中世界最好的语言original
2018-04-14 10:06:522444parcourir

Cette fois, je vais vous montrer où cela pointe lorsque vue utilise axios, et quelles sont les précautions lors de l'utilisation de vue pour appeler axios. Voici un cas pratique, jetons un coup d'œil.

Où en est-il lorsque vue utilise axios

Cet article présente principalement le problème de ce pointage lorsque Vue utilise axios. Je ne dirai pas grand-chose ci-dessous, jetons un œil à l'introduction détaillée.

1.Solution

Lorsque vous utilisez axios pour effectuer des requêtes réseau dans Vue, vous constaterez que cela ne pointe pas vers Vue, mais n'est pas défini. Vous pouvez utiliser la fonction flèche "=>" pour résoudre le problème. Comme suit :

methods: {
 loginAction(formName) {
 this.$axios.post('http://127.0.0.1/u/subLogin', {
  username: this.username,
  password: this.password
 })
  .then(function(response){
  console.log(this); //这里 this = undefined
  })
  .catch((error)=> {
  console.log(error); //箭头函数"=>"使this指向vue
  });
 });
 }
}

2. Raison

Le this interne de la fonction fléchée "=>" dans ES6 est la portée lexicale, qui est déterminée par le contexte (c'est-à-dire déterminée par la vue de l'appelant externe).

3.Digression

Grâce à la fonction "=>", vous pouvez dire adieu aux deux manières d'écrire précédentes :

bind(this) pour changer ce point de la fonction anonyme en

Méthode d'écriture de hack var _this= this; :

loginAction(formName) {
 var _this= this;
 this.$axios.post("...")
 .then(function(response){
  console.log(_this); //这里 _this 指向vue
 })
 });
 }

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 télécharger un tableau au format JSON dans un tableau Excel avec JS

Comment utiliser Jackson lors de l'analyse de la chaîne JSON Letter conversion de cas

Étapes de mise en œuvre de la fonction de validation angulaire

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