您好,登錄后才能下訂單哦!
這篇文章主要介紹了jquery和vue中的ajax有哪些區(qū)別的相關(guān)知識,內(nèi)容詳細(xì)易懂,操作簡單快捷,具有一定借鑒價(jià)值,相信大家閱讀完這篇jquery和vue中的ajax有哪些區(qū)別文章都會有所收獲,下面我們一起來看看吧。
區(qū)別:1、jquery中的ajax方法可以直接調(diào)用,而vue中不可以直接調(diào)用,因?yàn)関ue本身不支持ajax請求,需要借助指定的插件才能實(shí)現(xiàn);2、jquery中執(zhí)行異步HTTP請求,語法為“$.ajax({type:...,url:...,data:...,success:...,dataType:...})”,而vue中借助插件的語法為“axios.get(url...)”。
本教程操作環(huán)境:windows10系統(tǒng)、jquery3.4.1版本、Dell G3電腦。
ajax() 方法用于執(zhí)行 AJAX(異步 HTTP)請求。
1.$.ajax()是jQuery中底層ajax實(shí)現(xiàn),更高層的是$.get和$.post方法;
$(document).ready(function(){ $("#b01").click(function(){ htmlobj=$.ajax({url:"/jquery/test1.txt",async:false}); $("#myDiv").html(htmlobj.responseText); }); });
2.$.get方法,請求成功時(shí)的操作,如果想有請求失敗時(shí)的操作,要使用$.ajax()
$(selector).get(url,data,success(response,status,xhr),dataType) $("button").click(function(){ $.get("demo_ajax_load.txt", function(result){ $("div").html(result); }); });
是$.ajax的簡寫
$.ajax({ url: url, data: data, success: success, dataType: dataType });
例子:
3.$.post方法
$("input").keyup(function(){ txt=$("input").val(); $.post("demo_ajax_gethint.asp",{suggest:txt},function(result){ $("span").html(result); }); });
是下面的簡寫
$.ajax({ type: 'POST', url: url, data: data, success: success, dataType: dataType });
4.$.getJSON()
通過HTTP get請求獲得json數(shù)據(jù)
是下面的簡寫
5.兩個(gè)重要的方法
.serialize() 將表單內(nèi)容序列化為字符串;
.serializeArray() 序列化表單元素,返回JSON數(shù)據(jù)結(jié)構(gòu)數(shù)據(jù)。
vue本身不支持ajax請求,需要借助vue-resource,axios插件
vue2官方推薦axios,是一個(gè)基于Promise的HTTP請求客戶端,不再對vue-resource進(jìn)行維護(hù)和更新;
axios([options]) axios.get(url[,options]);
傳參方式:
1.通過url傳參
2.通過params選項(xiàng)傳參
axios.post(url,data,[options]);
axios默認(rèn)發(fā)送數(shù)據(jù)時(shí),數(shù)據(jù)格式是Request Payload,并非我們常用的Form Data格式,
所以參數(shù)必須要以鍵值對形式傳遞,不能以json形式傳參
傳參方式:
1.自己拼接為鍵值對
2.使用transformRequest,在請求發(fā)送前將請求數(shù)據(jù)進(jìn)行轉(zhuǎn)換
3.如果使用模塊化開發(fā),可以使用qs模塊進(jìn)行轉(zhuǎn)換
axios本身并不支持發(fā)送跨域的請求,沒有提供相應(yīng)的API,作者也暫沒計(jì)劃在axios添加支持發(fā)送跨域請求,所以只能使用第三方庫
關(guān)于“jquery和vue中的ajax有哪些區(qū)別”這篇文章的內(nèi)容就介紹到這里,感謝各位的閱讀!相信大家對“jquery和vue中的ajax有哪些區(qū)別”知識都有一定的了解,大家如果還想學(xué)習(xí)更多知識,歡迎關(guān)注億速云行業(yè)資訊頻道。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。