gongdecai 589c153a5a 1 | 1 éve | |
---|---|---|
.. | ||
app.js | 1 éve | |
carpool.js | 1 éve | |
code.js | 1 éve | |
index.js | 1 éve | |
interface.js | 1 éve | |
readme.md | 1 éve | |
user.js | 1 éve |
插件使用说明
config: {
baseUrl: "https://api.com/api/",
header: {
'Content-Type':'application/json;charset=UTF-8',
'Content-Type':'application/x-www-form-urlencoded'
},
dataType: "json",
responseType: "text"
},
interceptor: {
request: null,
response: null
}
//设置baseUrl
http.config.baseUrl = "http://localhost:8080/api/"
//设置请求前拦截器
http.interceptor.request = (config) => {
//添加通用参数
config.header = {
"token": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
}
}
//设置请求结束后拦截器
http.interceptor.response = (response) => {
//判断返回状态 执行相应操作
return response;
}
```
## 2. 使用
### 2.1 全局使用(在main.js注册)
``` // main.js
import api from '@/common/vmeitime-http/'
// 全局挂载后使用
Vue.prototype.$api = api
<template>
<view class="content">
<view class="uni-padding-wrap uni-common-mt">
<view class="uni-textarea uni-common-mt">
<textarea :value="res"></textarea>
</view>
<view class="uni-btn-v uni-common-mt">
<button type="primary" @click="sendRequest" :loading="loading">发起请求</button>
<button type="default" @click="sendRequest1" :loading="loading">发起请求(async/await)</button>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
loading: false,
res: ''
}
},
onLoad(option) {
//this.sendRequest();
//this.sendRequest1();
},
methods: {
// 方式一
sendRequest: function() {
this.loading = true
this.$api.test({noncestr: Date.now()}).then((res)=>{
this.loading = false;
console.log('request success', res)
uni.showToast({
title: '请求成功',
icon: 'success',
mask: true
});
this.res = '请求结果 : ' + JSON.stringify(res);
}).catch((err)=>{
this.loading = false;
console.log('request fail', err);
})
},
//方式二 https://segmentfault.com/a/1190000013292562?utm_source=channel-newest
async sendRequest1() {
this.loading = true
let res = await this.$api.test({noncestr: Date.now()});
this.loading = false;
this.res = '请求结果 : ' + JSON.stringify(res);
}
}
}
</script>
<template>
<view class="content">
<view class="uni-padding-wrap uni-common-mt">
<view class="uni-textarea uni-common-mt">
<textarea :value="res"></textarea>
</view>
<view class="uni-btn-v uni-common-mt">
<button type="primary" @click="sendRequest" :loading="loading">发起请求</button>
<button type="default" @click="sendRequest1" :loading="loading">发起请求(async/await)</button>
</view>
</view>
</view>
</template>
<script>
import api from '@/common/vmeitime-http/'
export default {
data() {
return {
loading: false,
res: ''
}
},
onLoad(option) {
//this.sendRequest();
//this.sendRequest1();
},
methods: {
// 方式一
sendRequest: function() {
this.loading = true
api.test({noncestr: Date.now()}).then((res)=>{
this.loading = false;
console.log('request success', res)
uni.showToast({
title: '请求成功',
icon: 'success',
mask: true
});
this.res = '请求结果 : ' + JSON.stringify(res);
}).catch((err)=>{
this.loading = false;
console.log('request fail', err);
})
},
//方式二
async sendRequest1() {
this.loading = true
let res = await this.api.test({noncestr: Date.now()});
this.loading = false;
this.res = '请求结果 : ' + JSON.stringify(res);
}
}
}
</script>
在vmeitime-http/interface.js文件中的request(Object)方法中补充修改相应的代码
在vmeitime-http/interface.js文件中的request(Object)方法中补充修改相应的代码
在vmeitime-http/index.js文件中的编写具体业务相关的接口,参考test()方法