@uyun/utils

Common utils for Uyun

集成常用的工具库，简化使用方法。本工具库对部分库进行了封装，请仔细查看文档及使用说明。

request

基于 axios 封装，集成了默认配置、自动取消和自动添加时间戳防止缓存的功能。

快速开始

import axios from '@uyun/utils/request'
import { Router } from 'react-router-dom'
import { createHashHistory } from 'history'

const history = createHashHistory()
const request = axios.create({
  baseURL: '/api',
  history
})

request.interceptors.response.use(res => res.data, error => {
  if (axios.isCancel(error)) {
    console.log('Request canceled: ', error.message);
  } else {
    ...
  }

  return Promise.reject(error)
})

...
<Router history={history}>
</Router>
...

默认配置

默认加入了如下配置：

{
  headers: {
    common: {
      'Content-Type': 'application/json; charset=utf-8'
    }
  }
}

自动取消

如果创建 axios 实例时传入了 history 对象，将开启路由跳转时自动取消请求的功能，适用于解决用户在快速跳转路由时引起的数据问题。

import request from './request'

request.get('/user/12345')
  .then(res => {
    ...
  })
request.post('/user/12345', { foo: 'bar' })
  .then(res => {
    ...
  })

// 路由跳转时将取消当前页面所发送且未返回信息的请求
history.push('/list')
// Request canceled: Auto-cancel
// Request canceled: Auto-cancel

指定关闭

某些特殊情况下不希望请求自动取消，可以指定某个请求关闭此功能。

import request from './request'

request.get('/user/12345', { cancel: false })
  .then(res => {
    ...
  })
request.post('/user/12345', { foo: 'bar' }, { cancel: false })
  .then(res => {
    ...
  })

// 路由跳转时不会取消这两个请求
history.push('/list')

恢复实例

恢复 request 实例后，不再具有自动取消功能。

request.restore()

自动添加时间戳防止缓存

默认自动在每个请求中添加当前时间戳，防止请求被浏览器缓存。

// 等同于
request.get('/list', {
  config: {
    params: {
      _: Date.now()
    }
  }
})

关闭自动添加时间戳

在创建实例时关闭。

axios.create({
  timestampParams: false
})

使用 eject 方法关闭。

request.interceptors.request.eject(request.timestampParamsInterceptor)

mock

基于 axios-mock-adapter 封装，覆盖了默认的延迟响应时间。

原生 axios-mock-adapter 默认没有延迟响应时间，需要手动设置。封装后默认 delayResponse 为 500ms，更符合实际应用场景。

import MockAdapter from '@uyun/utils/mock'
import request from './request'

const mock = new MockAdapter(request)

mock
  .onGet(...).reply(...)
  .onAny().passThrough()

指定延迟响应时间


const mock = new MockAdapter(request, {
  delayResponse: 1000
})

i18n

基于 everest-i18n 封装，默认从 cookie 读取语言或中文 zh_CN。

直接配置了语言并生成实例，导入多语言文本后，可直接在组件中引用 i18n 或 __ 方法并使用。

// index.js
import { intl } from '@uyun/utils/i18n'
import locale from './locale.json'

intl.merge(locale)

// Component.jsx
import __ from '@uyun/utils/i18n'

__('name', '名字')
__('total', '共 {total} 条', { total: 500 })

qs

基于 qs 封装，qs.parse 默认无视 querystring 中的问号。

原生 qs 默认需要手动指定 { ignoreQueryPrefix: true }。封装后覆盖了默认值为 true，更符合实际应用场景。

import qs from '@uyun/utils/qs'

window.location.href
// ?a=1&b=2

qs.parse(window.location.href)
// { a: 1, b: 2 }

qs.stringify({ a: 1, b: 2 })
// a=1&b=2

cookie

即 js-cookie。

import cookie from '@uyun/utils/cookie'

cookie.get('name')

cookie.set('name', 'value', { expires: 7, path: '/' })

base64

即 js-base64。

import base64 from '@uyun/utils/base64'

base64.encode('key')
// a2V5

base64.encodeURI('/url')
// L3VybA==

base64.decode('a2V5')
// key

uuid

即 node-uuid。

import uuid from '@uyun/utils/uuid'

uuid()
// '3b99e3e0-7598-11e8-90be-95472fb3ecbd'

Current Tags

1.1.2 ... latest (3 years ago)

16 Versions

1.1.2 ... 3 years ago
1.1.1 ... 3 years ago
1.1.0 ... 4 years ago
1.1.0-beta.0 ... 4 years ago
1.0.0-beta.0 ... 4 years ago
1.0.0 ... 4 years ago
0.3.0 ... 5 years ago
0.3.0-alpha.3 ... 5 years ago
0.3.0-alpha.2 ... 5 years ago
0.3.0-alpha.1 ... 5 years ago
0.3.0-alpha.0 ... 5 years ago
0.1.0 ... 6 years ago
0.1.1 ... 6 years ago
0.1.2 ... 6 years ago
0.2.0 ... 5 years ago
0.1.3 ... 6 years ago