javascript - erreur d'affectation des données d'initialisation de vue

Question

code vue

<script>
import axios from 'axios';
export default {
    data() {
        return {
            titleList: [],
        }
    },
    created() {
        this.axios.get('XX').then(function(response) {
            console.log(response.data);
            this.titleList=response.data;
        }).catch(function (error) {
            console.log(error);
        });
    }
}
</script>

Signaler une erreur

TypeError: Cannot set property 'titleList' of undefined
Erreur de type, impossible de définir une propriété non définie,

Données

response.data est un tableau d'objets
J'ai initialisé titleList, mais je ne sais pas pourquoi il dit qu'il n'est pas défini, veuillez me donner une réponse

Answer 1

Ce pointeur a changé. Vous pouvez l'imprimer pour voir à qui il pointe

.

---

Solution

1. Utilisez la fonction flèche
2. Enregistrez ceci (laissez _this = this)

.

Answer 2

.then(res => {
    this.titleList = res;
})

Answer 3

this.axios.get('XX')
    .then(function (response) {
      response=response.body;
      this.titleList=response.data;
    })
    .catch(function (error) {
      console.log(error);
})

Essayez ceci. Si cela ne fonctionne pas, publiez l'erreur et jetez un œil !

Answer 4

Ce pointeur est perdu, vous pouvez utiliser la fonction flèche, ou vous pouvez utiliser une variable pour le sauvegarder let _this = this

Answer 5

Lorsque j'utilise axios pour demander des données, je me souviens d'introduire la bibliothèque de classes axios globalement dans le fichier d'entrée du programme main.js. Après l'avoir importé, essayez d'utiliser Vue.prototype.$http=axios. pour l'étage Vous pouvez essayer ce problème de pointeur signalé dans la réponse donnée. Je suis habitué à la syntaxe d'es6, donc les fonctions fléchées sont généralement utilisées dans les projets

.

Answer 6

axios.get('***').then((res) => {
    this.titleList=res.data;
});

Essayez de cette façon