Maison >interface Web >Questions et réponses frontales >Quelle est la différence entre axios et ajax dans jquery

Quelle est la différence entre axios et ajax dans jquery

WBOY
WBOYoriginal
2022-06-14 19:09:032660parcourir

La différence entre axios et ajax dans jquery : 1. axios est une encapsulation de la technologie ajax via promise, tandis que jquery encapsule la technologie de requête dans ajax 2. axios est une bibliothèque HTTP basée sur Promise, et ajax est une encapsulation de natif ; XHR.

Quelle est la différence entre axios et ajax dans jquery

L'environnement d'exploitation de ce tutoriel : système Windows 10, jquery version 3.6.0, ordinateur Dell G3.

Quelle est la différence entre axios et ajax dans jquery ?

La différence entre axios et ajax :

axios est une bibliothèque HTTP basée sur Promise, tandis que ajax est une encapsulation de XHR natif

la technologie ajax réalise le rafraîchissement des données locales, et axios implémente l'encapsulation d'ajax.

axios est une encapsulation de la technologie ajax à travers des promesses, tout comme JQuery implémente l'encapsulation ajax.

Pour faire simple : la technologie ajax réalise un rafraîchissement partiel des données des pages Web, et axios réalise l'encapsulation d'ajax. En d'autres termes, jQuery encapsule la technologie de requête dans ajax, et grâce à la promesse, ajax est encapsulé dans axios. Axios est ajax, et ajax est bien plus qu'axios.

Avec ajax, pourquoi utiliser axios ?

Dans le mode mvvm front-end actuel, axios est plus adapté aux demandes de données.

Connaissances étendues :

définition ajax

En bref, AJAX charge les données en arrière-plan et les affiche sur la page Web sans recharger la page Web entière

jQuery exécute l'ajax natif pour nous Sans encapsulation, il ne nous reste plus qu'à une simple ligne de code pour implémenter la fonction AJAX.

1. Interface sous-jacente

    $.ajax({
      url:'',    //请求地址
      method:'',  //请求方式
      data:{},     //传参  无参可不写
      success:function(res){
        //请求成功的回调函数
      },
      error:function(err){
        //请求失败的回调函数
      },
    })

2. Raccourci

    $.get(url,data,function(res){})
    $.post(url,data,function(res){})

Utilisation de la requête axios

Axios est une bibliothèque HTTP basée sur promise (Promise est une solution de programmation asynchrone), qui peut être utilisée dans les navigateurs et

jQuery ajax dans node.js :

Il s'agit d'une programmation pour MVC, qui n'est pas conforme au MVVM frontal actuel

Basé sur le développement XHR natif, la structure de XHR elle-même n'est pas claire, et il existe déjà une alternative à fetch

JQuery entier C'est trop gros. Il est très déraisonnable d'introduire l'intégralité de JQuery en utilisant simplement ajax (vous ne pouvez pas profiter du service CDN si vous adoptez une solution de packaging personnalisée)

Utilisation native d'axios :

axios({
      url:'http://47.93.206.13:8002/user/login',
      // baseURL:'http://47.93.206.13:8002',
      method:'post',
      // params:    用于get请求
      data:{    //用于post请求
        username:'admin1',
        password:'123321'   
      }
    }).then((res) => {
      console.log(res);
    })

méthode de raccourci axios :

/ 引入
let axios=require('axios')//到当前node_modules找,找不到再往上找
// 封装写法
axios.get('http://47.107.65.238:8888/index/article/pageQuery?page=1&pageSize=10')
  .then(function (response) {
    console.log(response);
  })

Recommandation de didacticiel vidéo : Tutoriel vidéo jQuery

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn