在Vue中,向服務(wù)器提交數(shù)據(jù)通常需要使用AJAX來進(jìn)行異步請求。使用Vue的話,可以使用Vue Resource或Axios這些第三方庫。下面我們來介紹使用Vue Resource提交數(shù)據(jù)的方法。
首先,我們需要在HTML文件中引入Vue Resource庫:
<script src="https://cdn.jsdelivr.net/npm/vue-resource@1.5.1/dist/vue-resource.min.js"></script>
接著,在Vue實(shí)例的methods中添加需要請求的方法。比如,我們想要提交一個(gè)表單的數(shù)據(jù):
methods: {
submitData: function () {
this.$http.post('http://example.com/api/data', {
name: this.name,
age: this.age
}).then(function (response) {
console.log(response.body);
}, function (response) {
console.error(response);
});
}
}
上述代碼中,我們使用了Vue Resource庫中的$http.post方法。該方法會(huì)向指定的URL(本例中為http://example.com/api/data)發(fā)送POST請求,并傳遞表單中的name和age數(shù)據(jù)。
在接口請求的回調(diào)函數(shù)中,我們會(huì)得到一個(gè)響應(yīng)對(duì)象。我們可以通過response.body來獲取服務(wù)器返回的響應(yīng)數(shù)據(jù),也可以在第二個(gè)回調(diào)函數(shù)中處理請求失敗的情況。