Home

欢迎来到 nuomi-request wiki!

介绍

nuomi-request是基于 axios 封装的请求库，目的是为了方便接口的复用和维护，内置了mock功能可以在开发阶段进行模拟测试。

快速上手

安装

yarn

yarn add nuomi-request

npm

npm i --save nuomi-request

使用

import { createRequests } from 'nuomi-request';

const requests = createRequests({
  getList: '/path/getList:get',
  save: '/path/save:post',
}, {
  getList: {
    data: [{ id: '1' }, { id: '2' }],
    message: 'ok',
  },
  save: ({ content }) => {
    if (content) {
      return {
        data: {},
        message: 'ok',
      }
    }
    return {
      data: {},
      message: 'error',
    }
  },
});

requests.getList().then(({ data }) => {
  console.log(data.data); // [{ id: '1' }, { id: '2' }]
});

requests.save({ content: '' }).then(({ data }) => {
  console.log(data.message); // error
});

API速查

createRequests

createRequests(urls: object, mockData?: object);

urls参数是请求url以及别名的键值对，url末尾以“:方法名”结尾，get请求可以不用该结尾，默认包含“get、post、put、delete、postJSON”方法，post方法和postJSON方法的区别就是传给后台ContentType不同，post是application/x-www-form-urlencoded，postJSON是application/json。

const requests = createRequests({
  getList: '/path',
  getList: '/path:get',
  save: '/path:post',
  delete: '/path:delete',
  put: '/path:put',
  submit: '/path:postJSON',
})

返回值是一个对象，“对象.别名(data?: object, options?: object)”方法可以调用对应的请求，data参数就是需要传递给接口的参数，options参数是axios的配置项，方法返回promise。

requests.getList().then(...);
requests.save({ name: 'xxx' }).then(...);

mockData参数为可选的，是别名和mock对象的键值对，可以在开发环境本地模拟接口数据，生产环境该功能会被禁用，为了防止模拟数据被打包到代码里，最好用process.env.NODE_ENV判断，推荐 mockjs 来进行数据模拟。

createRequests({
  getList: '/path',
  save: '/path:post',
}, process.env.NODE_ENV !== 'production' ? {
  getList: Mock.mock({...})
  // 支持函数，data就是传递的参数，options是axios配置项，2个参数主要用于判断
  save: (data, options) => {
    return Mock.mock({...});
  },
} : null)

createMethod

createMethod(name: string, callback: Funtion);

当默认5个方法不满足需求时，用于自定义方法配置，name参数是方法名，callback是一个回调，返回axios调用，当方法名重复时，浏览器控制台会有警告。

createMethod('xxx', (url, data, options) => {
  return axios({
    url,
    method: 'post',
    data,
    ...options,
  });
})

const requests = createRequests({
  save: '/path:xxx',
});

requests.save().then(...);

axiosConfig

axiosConfig(options: object);

用于配置axios.defaults属性。

axiosConfig({
  baseURL: '/api',
  headers: {'X-Requested-With': 'XMLHttpRequest'},
});
// 等同
axios.defaults.baseURL = '/api';
axios.defaults.headers = {'X-Requested-With': 'XMLHttpRequest'};

axios

具体参考 axios API