Vue.jsクラスでタイマーを設定するには

Question

Vue.jsを使ってサイト上の投稿を更新するだけですが、これは今までにiveが行ったことです（これはまだJavaScriptを学んでいて、私が探しています何）

[app.js]

var Vue = require('vue'); 

Vue.use(require('vue-resource')); 

var app = new Vue({ 

    el: '#app', 

    components: { 
    'postlist' : require('./components/postlist/postlist.js') 
    } 

}); 

[postlist.js]

module.exports = { 

    template: require('./postlist.template.html'), 

    data: function() { 
    return { 
     'search': '', 
     'posts' : {} 
    } 
    }, 

    methods: { 
    'updatePosts' : function() 
    { 
     this.$http.get('api/posts', function(responce, status, request) 
     { 
     this.$set('posts', responce.data); 
     }); 
    } 
    } 
}; 

x秒ごとにupdatePostsを起動させるにはどうしたらいいですか？

IVEはapp.js

setInterval(function() 
{ 
    app.components.postlist.methods.updatePosts(); // doesnt work 
    app.postlist.updatePosts(); //doesnt work either 
}, 500); 

でこれをやってみましたし、かなりこれで失われたコンポーネント自体

イム、これを達成するためにいただきました！最良の方法へのsetIntervalを入れてみましたか？

updatePostsがx秒ごとに実行されますか？

Answer 1

createdまたはライフサイクルのどこかでリクエストサイクルを開始できます。ここでは再帰を使うほうが良いでしょうから、別のものを送る前に応答が返るのを待つことができます。私はこのコードを完全にはテストしませんでしたが、うまくいくはずです。

module.exports = { 
    template: require('./postlist.template.html'), 
    data: function() { 
    return { 
     'search': '', 
     posts: {} 
    } 
    }, 
    methods: { 
    updatePosts: function() { 
     this.$http.get('api/posts', function(responce, status, request) { 
     this.posts = responce.data; 
     setTimeout(this.updatePosts, 2000); 
     }); 
    } 
    }, 
    created: function() { 
    this.updatePosts(); 
    } 
} 

Answer 2

私はVueのスコープにも問題があります。

これはVueの中で

module.exports = { 
    template: require('./postlist.template.html'), 
    data: function() { 
    return { 
     'search': '', 
     posts: {} 
    } 
    }, 
    methods: { 
    updatePosts: function() { 
     var self = this; 
     self.$http.get('api/posts', function(responce, status, request) { 
     self.posts = responce.data; 
     setTimeout(function(){ self.updatePosts() }, 2000); 
     }); 
    } 
    }, 
    created: function() { 
    this.updatePosts(); 
    } 
} 

機能を動作するはずです、あなたの方法updatePostsは通常の関数ではないので、ちょっと違うように動作します。 $vm.methodsオブジェクトで定義されている関数です。定期的にsetTimeout($vm.updatePosts)のように呼び出すことはできません。実際には$vm.updatePostsは存在しません。もしあなたが$vm.updatePosts()のようにそれを呼び出すなら、それは別の話です。 $vmインスタンスは自動的にそのメソッドを呼び出します。正しい方法はsetTimeout(function(){ self.updatePosts() },2000)