wake-up-neo.net

so legen Sie das Zeitlimit in einer VueJs-Methode fest

wie kann ich die Funktion settimeout () in einer vuejs-Methode verwenden?

Ich habe sowas schon probiert, aber es funktioniert nicht 

fetchHole: function () { 
    //get data
},

addHole: function () {
    //my query add new
    setTimeout(function () { this.fetchHole() }, 1000)
},

Ich erhalte folgende Fehlermeldung: Uncaught TypeError: this.fetchHole is not a function

javascriptphpjquerylaravel-5vue.js
20
user3757488

Versuchen Sie Folgendes: setTimeout(this.fetchHole, 1000), da this in der anonymen Funktion dieser anonymen Funktion nicht an Ihre Hauptfunktion angehängt ist

25
nospor

Fügen Sie Ihrer Funktionsdeklaration einen Aufruf bind() hinzu:

setTimeout(function () { this.fetchHole() }.bind(this), 1000)

damit ist die this Ihrer Vue-Komponente innerhalb der Funktion verfügbar.

Randbemerkung: Die akzeptierte Antwort von @nospor ist in dieser speziellen Situation sauberer. Der bind-Ansatz ist etwas verallgemeinert - sehr nützlich, wenn Sie zum Beispiel eine anonyme Funktion ausführen möchten.

31
ceejayoz

Das klassische Problem mit kontextabhängiger this in JavaScript. 

Der folgende Teil des Codes zeigt eine einfache Lösung - wenn Sie ES6 mit Vuejs verwenden (Standardkonfiguration mit vuecli y babel). Verwenden Sie eine Pfeilfunktion

setTimeout(()=>{
   this.yourMethod()
},1000);
18
Deiviz

Ich denke das funktioniert auch.

var self = this;
setTimeout(function () { self.fetchHole() } , 1000)
1
Rubens Barbosa

Rekursiv mit TimeOut aufrufen:

    save: function () {
      this.progressToProced = 0
      this.progress()          
    },
    progress: function () {
      if (this.progressToProced < 100) {
        this.progressToProced++
        setTimeout(function () { this.progress() }.bind(this), 100)
      }
    }
0
Darlan Dieterich