Qu'est-ce que vue.resource

vue-resource est un plug-in de [Vue.js]. Il peut lancer des requêtes et traiter des réponses via XMLHttpRequest ou JSONP. En d'autres termes, ce que [$.ajax] peut faire, [vue-resource. ] ] Les plug-ins peuvent faire de même.

L'environnement d'exploitation de ce tutoriel : système Windows 7, Vue version 2.9.6, ordinateur thinkpad t480.

Fonctionnalités vue-resource

Le plug-in vue-resource a les fonctionnalités suivantes :

1. Petite taille

vue. -resource est très petite, seulement environ 12 Ko après compression et seulement 4,5 Ko après l'activation de la compression gzip sur le serveur, ce qui est beaucoup plus petit que jQuery.

2. Prend en charge les navigateurs grand public

Identique à Vue.js, sauf que vue-resource ne prend pas en charge les navigateurs inférieurs à IE 9, il est pris en charge par d'autres navigateurs grand public.

3. Prise en charge des modèles d'API et d'URI Promise

Promise est une fonctionnalité d'ES6. La signification chinoise de Promise est « prophète », et les objets Promise sont utilisés pour les calculs asynchrones.

Les modèles URI représentent des modèles URI, qui sont quelque peu similaires aux modèles de routage ASP.NET MVC.

4. Prise en charge des intercepteurs

Les intercepteurs sont globaux et peuvent effectuer certains traitements avant et après l'envoi de la requête.

Les intercepteurs peuvent être très utiles dans certains scénarios, comme définir access_token dans les en-têtes avant d'envoyer une requête, ou fournir une méthode de traitement commune lorsqu'une requête échoue.

vue-resource utilise

pour introduire vue-resource#

<script src="js/vue.js"></script>
<script src="js/vue-resource.js"></script>

Syntaxe de base#

Après avoir introduit vue-resource, vous pouvez utiliser http basé sur l'objet Vue global ou utiliser http basé sur une certaine instance Vue.

// 基于全局Vue对象使用http
Vue.http.get('/someUrl', [options]).then(successCallback, errorCallback);
Vue.http.post('/someUrl', [body], [options]).then(successCallback, errorCallback);
// 在一个Vue实例内使用$http
this.$http.get('/someUrl', [options]).then(successCallback, errorCallback);
this.$http.post('/someUrl', [body], [options]).then(successCallback, errorCallback);

Après avoir envoyé la demande, utilisez la méthode then pour traiter le résultat de la réponse. La méthode then a deux paramètres. Le premier paramètre est la fonction de rappel lorsque la réponse est réussie et le deuxième paramètre est la fonction de rappel. quand la réponse échoue. Il existe également deux façons d'écrire la fonction de rappel de la méthode

then. La première est l'écriture de fonction traditionnelle, et la seconde est la méthode d'écriture Lambda plus concise d'ES 6 :

// 传统写法
this.$http.get('/someUrl', [options]).then(function(response){
// 响应成功回调
}, function(response){
// 响应错误回调
});
// Lambda写法
this.$http.get('/someUrl', [options]).then((response) => {
// 响应成功回调
}, (response) => {
// 响应错误回调
});

.

Recommandations d'apprentissage gratuites associées : javascript (vidéo)

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!