1.2.1 • Published 2 years ago

bmock v1.2.1

Weekly downloads
-
License
ISC
Repository
github
Last release
2 years ago

前后端分离,前端自由动态模拟后端返回数据

前端开发完部署到环境,让后端开发对比mock数据自己玩去吧。

The front and back ends are separated, and the front end freely and dynamically simulates the data returned by the back end

After the front-end development is completed and deployed to the environment, let the back-end development compare the mock data to play by himself

使用案例(Usage)

// axios 只是作为例子使用,并不依赖,可以是任何异步或者同步函数
// axios is only used as an example and does not depend on it, it can be any asynchronous or synchronous function
import axios from 'axios';
import { mock } from 'bmock';
// import mockdata from './xxx';

const delay = (data, time = 500) => new Promise((resolve) => {
  setTimeout(resolve, time, data);
});

const mockData = {
  '/api/user/1': {
    status: 0,
    data: {},
  },
  'api/user/2': () => {
    return {
      status: 0,
    }
  },
  '/api/verifyCode': () => {
    return delay({
      status: 0,
      data: {
        verifyCode: 999 + Math.ceil(Math.random() * 9000),
      },
    });
  },
  '/api/login': () => {
    count++;
    return delay({
      status: [0, -1][count % 2],
      msg: 'error, try again',
      data: {
        token: Math.random().toString(36).slice(2),
      },
    });
  },
  '/api/list': (param) => {
    const { page } = param;
    const { pageNo = 1, pageSize = 15 } = page || {};
    const totalSize = 101;
    const totalData = Array.from({length: totalSize}, (_, index) => ({
      code: `shopCode${index + 1}`,
      address: 'xxxx',
      title: `xxx${index + 1}`,
    }));
    return delay({
      "status": 0,
      "msg": "",
      "data": {
        "page": {
          curPage: pageNo,
          pageSize,
          totalSize,
        },
        data: totalData.slice((pageNo - 1) * pageSize, pageNo * pageSize),
      }
    });
  },
};

// default
const axios1 = mock(axios, {
  data: mockData, //必需(required)
});
// or
// the key of mockData must match /^(?:http[s]?:\/\/\S+?)?\/\S+$/ when using this way
// /xx, https://xx.xx/xx, http://xx.xx/x ...
const axios1 = mock(axios, mockData);
axios1({ url: 'xxx'});

// 自定义配置参数
// Custom configuration parameters
const axios2 = mock(axios, {

  // 必需
  // 支持函数: data: () => mockData;支持异步thenable: data: () => Promise.resolve(mockData)
  // required
  // suport function: data: () => mockData; support async thenable function: data: () => Promise.resolve(mockData)
  data: mockdata,

  // 非必需,默认值:__MOCK__
  // 通过在url中添加__MOCK__参数,开启mock模式,当前url页面所发起的所有请求都使用mock数据(isProd为false且未配置isMock)
  // not required, default value: __MOCK__
  // By adding the __MOCK__ parameter to the url, the mock mode is enabled,
  // and all requests initiated by the current url page use mock data (isProd is false and isMock is not configured)
  // https://xx.com/xx/xxxx?__MOCK__
  flag: '__MOCK__',

  // 非必需,默认值:false
  // 支持boolean或者函数,当传入boolean值时,控制所有请求是否使用mock数据,true: 使用,false:不使用
  // 当传入函数: isMock: ({ __mock } = {}) => __mock 时,针对单独请求进行mock
  // not required, default value: false
  // support boolean or function, when the boolean value is passed in, control whether to use mock data for all requests, true: use, false: not use
  // when passing in the function: isMock: ({ __mock } = {}) => __mock, it can be mocked for individual requests

  // const axios1 = mock(axios, {data: mockData, isMock: ({ __mock } = {}) => __mock})
  // axios1({url: '/user/1', __mock: true })
  // axios1({url: '/user/2', __mock: false })
  isMock : true,

  // 非必需,默认值:false
  // 支持函数方式:
  // isProd: () => true; 返回值为true时,不支持mock;返回值为false时,支持mock
  // not required, default value: false
  // the function method is supported:
  // isProd: () => true; when the return value is true, mocking is not supported; when the return value is false, mocking is supported
  isProd: false,

  // 非必需, 默认值为:"url"
  // 通过该值去匹配mockData中的数据, 匹配失败,则不进行mock
  // not required, default value: "url"
  // which is used to match the data in mockData, If the match fails, mocking will not be performed.

  // const mockData = {'/user/1', () => {}};
  // const axios1 = mock(axios, { data: mockData, key: 'url' });
  // axios1({url: '/user/1' });
  key: 'url',

  // 非必需
  // 与字段“key”作用一致,优先级高于字段“key”,
  // 该函数参数为被mock函数的参数
  // not required
  // It has the same function as the field "key", and has a higher priority than the field "key".
  // The function parameter is the parameter of the mocked function

  // const mockData = {'/user/1', () => {}};
  // const axios1 = mock(axios, { data: mockData, setPath: ({ url }) => url });
  // axios1({ url: '/user/1' });
  setPath: ({ url } = {}) => url,

});

// 注意:mock权重 isProd > isMock > flag
// warn: mock's priority: isProd > isMock > flag

axios2({ url, __mock: true });

// usage 3
// mock axios get|post
const axiosGet = mock(axios.get, { data: mockData });
const axiosPost = mock(axios.post, { data: mockData });
axiosGet('/user/1', {});

// usage 4
// async function
const asyncFn = ({ path, __isMock, data } = {}) => Promise.resolve({});

const mockAsyncFn1 = mock(asyncFn, { key: 'path', data: mockData, isMock: true });
mockAsyncFn1({ path: '/user/1', data: {} }).then((data) => {}); // mock all

const mockAsyncFn2 = mock(asyncFn, { data: mockData, setPath:({ path }) => path, /*or key: 'path'*/ isMock: ({ __isMock }) => __isMock);
mockAsyncFn2({ path: '/user/1', __isMock: true, data: {} });  // only mock path '/user/1'
mockAsyncFn2({ path: '/user/2', __isMock: false, data: {} });

// usage 5
// sync function
const fn = (param) => ({});
const mockFn = mock(fn, { data: mockData });
mockFn(param);
1.2.1

2 years ago

1.2.0

3 years ago

1.1.9

3 years ago

1.1.8

3 years ago

1.1.7

3 years ago

1.1.6

3 years ago

1.1.5

3 years ago

1.1.4

3 years ago

1.1.3

3 years ago

1.1.2

3 years ago

1.1.1

3 years ago

1.1.0

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago