vue-ajax小封装实例

前端之家收集整理的这篇文章主要介绍了vue-ajax小封装实例前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

1. js 文件

//当请求完成之后调用回调函数返回数据
this.success(fn,//字符串转换json
json: function (str){
return (new Function("return " + str))();
},success: function (fn,ojson){
//当请求完成之后调用回调函数返回数据
var self=this;
this.xhr.onreadystatechange=function (){
var odata;
if(self.xhr.readyState == 4){
if((self.xhr.status>=200 && self.xhr.status<300) || self.xhr.status == 304){
odata=self.xhr.responseText;
//若为json则转化json格式
if(ojson==="json"){
odata=self.json(odata);
}
fn(odata);
}else{
odata="request was unsuccessful: "+self.xhr.status;
fn(odata);
}
}
}
},//取消异步请求
cancel: function (){
this.xhr.abort();
return this;
}
}

2. html示例:

<Meta charset="UTF-8"> Document
获取信息 {{ msg }}

<script src="vue.js">
<script src="vue-ajax.js">

3. 需要获取的数据(1.json)

4. 结果

以上这篇vue-ajax小封装实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。

原文链接:https://www.f2er.com/ajax/36350.html

猜你在找的Ajax相关文章