Repository files navigation

Taro 数据 Mock 插件

在 Taro 项目根目录下安装

$ npm i @tarojs/plugin-mock --save

请确保 Taro CLI 已升级至 Taro 2/3 的最新版本。

修改项目config/index.js 中的 plugins 配置为如下

constconfig={  ...plugins:[    ...其余插件'@tarojs/plugin-mock']...}

这样在taro build 编译完后就会启动一个数据 mock 服务器。

Mock 插件可以接受如下参数：

其中mocks 参数是用于设置数据 mock 接口，以 k-v 的方式进行设置，接口的 HTTP 方法通过在 key 中进行指定，例如：

{  'GET /api/user/1': {    name: luckyadam  },  'POST /api/upload': {    file: xxxx  }}

支持的 HTTP 方法有：['GET', 'POST', 'HEAD', 'PUT', 'DELETE', 'CONNECT', 'OPTIONS', 'TRACE', 'PATCH']

如果项目中的接口过多，也可以不通过插件的mocks 配置来设置接口，可以直接在项目中创建一个mock 目录，在mock 下添加接口配置文件来设置接口，接口配置文件支持使用 ES6 语法以及 TS，例如。

如上配置可以改写成，在项目根目录下创建mock 目录，添加一个api.ts 文件，内容如下：

// mock/api.tsexportdefault{'GET /api/user/1':{name:luckyadam},'POST /api/upload':{file:xxxx}}

同时也支持使用mockjs 来生成 mock 数据

安装mockjs

$ npm i mockjs --save

使用如下

// /mock/api.tsimportmockjsfrom'mockjs'exportdefault{'GET /api/tags':mockjs.mock({'list|1-10':[{// 属性 id 是一个自增数，起始值为 1，每次增 1'id|+1':1}]})}