Papayaui

Appearance

请求 ​

TIP

当前内部封装了一个请求类，使用类 axios 语法

基本用法 ​

ts
import request from 'papayaui/request'

const fetch = request.create({
  baseUrl: 'http://xxxxxxx',
})

fetch.get('/api/xxx', { name: 'xxx' })
fetch.post('/api/xxx', { name: 'xxx' })
fetch.put('/api/xxx', { name: 'xxx' })
fetch.delete('/api/xxx', { name: 'xxx' })

fetch.request({
  url: '/api/xxx',
  method: 'POST',
  data: { name: 'xxx' },
})

拦截器 ​

请求拦截

TIP

返回 false 会阻止请求，支持 Promise。 多个时会顺序执行，后面执行的 config 是前面返回的值

ts
request.interceptor.request.use((config) => {
  // 判断请求路径是否为 api 开头
  if (!config.url.startsWith('/api')) return false
  // 修改请求头
  config.header['Authorization'] = `Bearer xxx`
  return config
})

request.interceptor.request.use(async (config) => {
  // token 获取失败，阻止请求
  const token = await getToken().catch(() => Promise.reject(false))
  // 修改请求头
  config.header['Authorization'] = `Bearer ${token}`
  return config
})

响应拦截

TIP

返回 false 代表请求失败，可以用对应请求的 catch 处理，支持 Promise。 多个时会顺序执行，response 值是一致的

ts
request.interceptor.response.use((response) => {
  const result = response.data

  if (result.code === 0) {
    return result.data
  } else {
    // 其他错误
    console.log(result.message)
    return false
  }
})

request.interceptor.response.use(async (response) => {
  const result = response.data

  if (result.code === 401) {
    console.log('未登录')
    // 重新登录
    await login()
    // 跳转到首页
    toIndex()
  }
})

配置 ​

TIP

继承自 uni.request 的 UniApp.RequestOptions 类型，在此基础上增加如下配置项。 基础配置请查看 UniApp 文档

参数说明类型默认值
baseUrl基础路径string-
showLoading是否显示加载状态booleantrue
loadingType加载状态类型
model：小程序中间加载模态框
navigation：页面标题显示加载状态(默认)		modal | navigationnavigation
loadingText加载文案（仅model模式有效）string加载中...
loadingTime请求超过多少时间显示加载状态（毫秒）number300
loadingMask加载状态是否需要全屏遮罩（防止加载中点击其他元素）booleantrue
validateStatus判断是否请求失败(status: number) => boolean(status) => status === 200