# Ajax

该类型是在axios的基础上进行了封装，对后台返回的数据进行预处理，以简化数据访问操作。在调用接口时，会自动调用layer.showLoadin)和layer.hideLoading方法。该类共定义了5个方法，所有方法均返回一个Promise对象。

# 基础

# 使用

import {Ajax} from 'sjfx';

# 属性

属性名	类型	说明
header	Object	该对象下的所有数据均会添加到Ajax请求头中。主要用于发送token
pageMode	String	请求分页数据时，发送到后台的参数。当前支持limit（limit，offset）、page（page,pageSize）两种模式
onlyData	Boolean	在自动处理模式下，是否仅返回data，以避免多余嵌套。默认为false。可在main.js中设置该值为true
OriginalData	Json	接口返回的原始数据。用于在自动处理模式下需要访问原json的场景。仅保留最后一次的Ajax请求结果，所以在多个请求时无法正常使用。目前暂无应用场景

# 方法

方法名	说明	参数
get	使用get方式提交数据，并获取json数据	url, params, autoFilter
post	使用post方式提交form数据，并获取json数据	url, params, autoFilter
postJson	使用get方式提交json数据，并获取json数据	url, params, autoFilter
getText	使用get方式提交，并获取非json数据	url, params
getPage	使用get方式提交数据，并获取分页json数据	url, page, opt

# 成功返回示例（Json ）：

{
  success : true ,
  total : 2 ,
  msg : '成功' ,
  data : [{
    id : 1 ,
    name  : "张三"
  },{
    id : 2 ,
    name  : "李四"
  }]
}

# 失败返回示例（Json ）：

{
  success : false ,
  msg : '数据已在使用中'
}

# get、post、postJson

这三个方法有相同的参数，且默认对结果进行预处理

参数	说明	数据类型
url	接口地址	String
params	提交到后台的数据	Object，get方法可不传该参数
autoFilter	是否预处理	Boolean，默认为true

# 预处理

仅当后台接口返回数据，状态值为200或304时，进行下一步，否则报错仅当后台接口返回数据为json类型时，进行下一步，否则报错当json数据的success为false时，弹出错误提示，并显示后台返回的的msg或者errMsg

# Demo

# 请求结果

{
	"success":true,
	"point":123
}

# 代码

import {Ajax} from 'sjfx';

Ajax.get('/User/Point').then( res =>{
	//res = {point:123}
})
Ajax.get('/User/Point',{},false).then( res =>{
	//res = {data:{point:123}}}
})

# getPage

参数	说明	数据类型
url	接口地址	String
page	页码	Number
opt	其他参数	Object

# opt参数说明

paras：Object，可选，传递给后台接口的参数
limit： Number，可选，每页数据条数，默认为10
onEnd(isFirst)：Function，可选，没有更多数据时触发。
	isFirst是一个bool值，表示当前是否为第一页
filter： Function，可选，对接口数据进行转换（如果后台返回的json数据不是data和total）

# Demo

import {Ajax} from 'sjfx';

Ajax.getPage('/User/List',1,{
	limit:10
}).then( res =>{	
	// res:同get方式
})

# getText

参数	说明	数据类型
url	接口地址	String
params	提交到后台的数据	Object，get方法可不传该参数

# Demo

# 请求结果

<p>Hello World!</p>

# 代码

import {Ajax} from 'sjfx';

Ajax.getText('/User/UserSign').then( res =>{
	//res = '<p>Hello World!</p>'
})

# AjaxPro

该类是Ajax的高级化运用，与Ajax实例相比有以下几点不同： 1.不自动处理错误 2.可自定义是否显示加载动画 3.它是一个类，使用方式与Ajax不同（Ajax是类的实例） 4.由于需要实例化才可以使用AjaxPro，所以每个AjaxPro都是独立的实例，互不影响 5.AjaxPro的实例不支持并发请求，必须完成一个请求才能进行下一次请求

# 签名

实例化类的时候，必须传入一个对象，该对象可以包含以下参数： url：接口地址，必传，且接口地址应该是 data：提交到接口的参数。这部分参数应该是固定的、不变化的 sendType：提交方式，支持get、post、postJson，默认为get resultType：获取的数据类型，支持json、text、blob，默认为json loading：是否显示加载动画，默认为true

# 属性

url：接口地址，必传 data：提交到接口的参数。这部分参数应该是固定的、不变化的 sendType：提交方式，支持get、post、postJson，默认为get resultType：获取的数据类型，支持json、text、blob，默认为json loading：当前加载状态，View可根据loading来控制按钮的文字和可点击状态 useLoading：是否显示加载动画，默认为true

# 方法

submit(data，url) url:接口地址。由于签名中已经定义了url，所以调用submit时，该参数非必传 paras：需要提交到接口的数据

注意：属性中的loading与传入参数的loading不同

# 实例

  import AjaxPro from '../../../math/ajax_pro.js'
//get  
  let ajax = new AjaxPro({
  	url: 'http://192.168.1.23:8000/account/api/v1/user?accountType=point'
  });
  ajax.submit().then((data) => {
	  console.log(data, ajax.result);
  });
  
//post  
  ajax = new AjaxPro({
	  url: 'http://192.168.1.23:8000/account/api/v1/user',
	  sendType: 'post'
  });
  ajax.submit({
 	 name: 'hello'
  }).then((data) => {
	  console.log(data, ajax.result);
  });
//post json  
  ajax = new AjaxPro({
	  url: 'http://192.168.1.23:8000/account/api/v1/user',
	  sendType: 'postJson'
  });
  
  ajax.submit({
 	 name: 'hello'
  }).then((data) => {
	  console.log(data, ajax.result);
  });

ArrayTool →