uni-app开发封装和vue网络请求一样的方法

话不多说,直接展示代码

这是封装的一个统一接口调用的js文件



export const apiResquest = (prams) => { //prams 为我们需要调用的接口API的参数 下面会贴具体代码
	return new Promise((resolve, reject) => {
		 let url = requestConfig.baseURL + prams.url;//请求的网络地址和局地的api地址组合(如:http://127.0.0.1:8080 + /user/userLogin >>> http://127.0.0.1:8080/user/userLogin)
		 return uni.request({
		 	url: url,
		 	data: prams.query,
		 	method: prams.method,
		 	timeout: requestConfig.timeout,
		 	success: (res) => {
		 		resolve(res.data);
		 	},
		 	fail: (err) => {
		 		 reject(err);
		 	},
		 	complete: () => {
		 		console.log('请求完成')
		 	}
		 });
	 })
}

接下来就是api的请求代码了也是一个js文件,

首先要引入上面封装的js文件,我这里是自己建了一个request文件夹,然后再建一个index的js文件

import {apiResquest} from '../request/index.js'

export const userLogin = (query) => {
  return apiResquest({
    url:'/user/login',
    method:'post',
    query:query
  })
}

这个代码没有注释详细兄弟姐妹都可以看明白啦

这样基本就完成了,不够还是把这个请求的流程走完啦

接下来就是在uni-app项目里面的页面文件里面使用啦

还是话不多说直接代码

上面是页面文件里面的一段js代码

 

这就是整个uni-app开发自己封装的一个api请求方法,

是不是和vue的使用一模一样了,

也很简单实用

喜欢的就收藏啦,

别忘了点赞哦

end

 

你可能感兴趣的:(vue,ajax,前端,web,app,html5)