Браузер | Поддержка |
---|---|
Chrome | Последняя версия |
Firefox | Последняя версия |
Safari | Последняя версия |
Opera | Последняя версия |
Edge | Последняя версия |
IE | 11 |
npm install vue-apis
// или
yarn add vue-apis
import Vue from 'vue'
import VueApis from 'vue-apis'
Vue.use(VueApis, options)
Функция | Пример | Аргумент | Описание |
---|---|---|---|
setUrl | setUrl('https://baidu.com') | (url: String) | Устанавливает адрес URL запроса |
setData | setData({ a: 1}) | (data: Object) | Устанавливает объект тела POST-запроса |
setParams | setParams({ t: Date.now() }) | (params: Object) | Устанавливает параметры запроса URL |
setHeaders | setHeaders({ 'content-type': 'application/json' }) | (headers: Object) | Устанавливает заголовки запроса |
setTimeout | setTimeout(10000) | (timeout: Number) | Устанавливает время ожидания запроса |
setCustomOptions | setCustomOptions({ responseType: 'stream' }) | (options: Object, clear: boolean) | Устанавливает пользовательские опции |
Ключ опции | Тип | Значение по умолчанию | Описание |
---|---|---|---|
apis | object | {} | Набор API |
showLoading | function | undefined | Функция для отображения макета загрузки |
hideLoading | function | undefined | Функция для скрытия макета загрузки |
interceptors | InterceptorObject | undefined | Можно перехватывать запросы или ответы перед их обработкой then или catch |
Поле | Тип | Описание |
---|---|---|
request | RequestObject / Function | Если экземпляр — функция, это обратный вызов «then» для перехватчика |
response | ResponseObject / Function | Если экземпляр — функция, это обратный вызов «then» для перехватчика |
Функция | Например |
---|---|
then | (config) => { return config; } |
catch | (error) => { return Promise.reject(error); } |
Функция | Например |
---|---|
then | (response) => { return response; } |
catch | (error) => { return Promise.reject(error); } |
import Vue from 'vue'
import VueApis from 'vue-apis'
import Api from './api'
Vue.use(VueApis, {
apis: Api,
showLoading: () => {
console.log('showLoading')
},
hideLoading: () => {
console.log('hideLoading')
},
interceptors: {
request: {
then(config) {
// Сделать что-то перед отправкой запроса
return config;
},
catch(error) {
// Сделать что-то с ошибкой запроса
return Promise.reject(error);
}
},
response: {
then(response) {
// Сделать что-то с данными ответа
return response;
},
catch(error) {
// Сделать что-то с ошибкой ответа
return Promise.reject(error);
}
}
}
})
import { ApiOptions, ApiMethod } from
``` **vue-apis**
const $api = {
readme () {
return new ApiOptions()
.setUrl(https://raw.githubusercontent.com/Chans-Open-Source/vue-apis/master/README.md
)
.setMethod(ApiMethod.GET)
.setParams({
timestamp: Date.now()
})
.setHeaders({
Authorization: Bearer ${Date.now()}
})
.request()
}
}
export default $api
**home.vue**
```html
<template>
<div v-html="readme"></div>
</template>
<script>
export default {
data () {
return {
readme: ''
}
},
async created () {
const res = await this.$apis.readme()
this.readme = res
}
}
</script>
const $api = {
formDataRequest (formData) {
return new ApiOptions()
.setUrl(URL)
.setMethod(ApiMethod.POST)
.setData(formData)
.request()
}
}
const formData = new window.FormData()
formData.append(key, value)
// Request
this.$apis.formDataRequest(formData)
const $api = {
formDataRequest (formData) {
return new ApiOptions()
.setUrl(URL)
.setMethod(ApiMethod.POST)
.setData(formData)
.setCustomOptions({
url: `https://baidu.com`, // invalid
data: {}, // invalid
params: {}, // invalid
headers: {}, // invalid
method: {}, // invalid
responseType: 'stream' // valid
}, /* is clear all custom options at first */ false)
.request()
}
}
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )