dva框架使用mockjs模拟数据

第一步:在框架下的mock文件夹下新建users.js(对应users路由下的页面)

const Mock = require('mockjs');//导入mock.js模块

const config=require("../src/utils/config");
const {apiPrefix}=config;
const userData=Mock.mock({
    'data|95':[{
        'key|+1':1,
        'name':'Edward King',
        'age':32,
        'address':'London, Park Lane no1'
    }]
})

module.exports={
    //post 请求   /api/v1/users/是拦截地址   方法内部接受request  response对象
    [`GET ${apiPrefix}/users`](req,res){
        res.json(userData)
    }
}

第二步:在.umirc.mock.js中导入mock

const mock = {}
require('fs').readdirSync(require('path').join(__dirname + '/mock')).forEach(function(file) {
    Object.assign(mock, require('./mock/' + file))
})
module.exports = mock

第三步:需要数据的地方用fetch请求
utils/request.js

export default async function request(url, options) {
  return fetch(url, options)
    .then(checkStatus)
    .then(parseJSON)
    .then(data => ({ data }))
    .catch(err => ({ err }));
}

users/services/users.js

export async function load(params){
    return request(`${APIV1}/users`,
        {
            method:'GET',
        }
    )
}

config.js

const mainUrl = 'http://199.199.1.146/';
const APIV1 = '/api/v1'
module.exports = {
  apiPrefix: '/api/v1',
  APIV1,
};
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,957评论 19 139
  • 初始化 安装 dva-cli 用于初始化项目: 创建项目目录,并进入该目录: 初始化项目: 然后运行 npm st...
    Paranoid_K阅读 121,074评论 11 104
  • 22年12月更新:个人网站关停,如果仍旧对旧教程有兴趣参考 Github 的markdown内容[https://...
    tangyefei阅读 35,231评论 22 257
  • 今天技术合伙人被坑的文章很火,冯大辉前辈写了一段文字,我觉得挺好,就转出来了。 By @Fenng 给创业公司的技...
    alsmn阅读 582评论 0 0
  • 本来想写篇文章,但是看到这篇文章,觉得很值得拿出来和战友们分享!这是篇来自“锤子阅读”:如何判断一件事情是否值得坚...
    船长时间阅读 257评论 0 0