美文网首页
mockjs模拟后端数据实现前后端同时开发

mockjs模拟后端数据实现前后端同时开发

作者: kzc爱吃梨 | 来源:发表于2020-05-15 12:00 被阅读0次

    第一步:

    npm install mockjs --save
    

    第二步:
    在mian.js引入

    //开发环境下使用mock
    if(process.env.NODE_ENV == 'development') require('@/api/mock')
    

    mock.js的配置

    import Mock from 'mockjs';
    
    //配置请求延时
    Mock.setup({
       timeout:1000 //一秒后返回数据
    })
    
    //直接使用字符串匹配路径还可以使用正则匹配路径
    // Mock.mock('/api/user',{
    //     username:"老陈",
    //     age:18,
    //     gender:"男",
    //     type:"帅"
    // })
    
    //可以写正则
    // Mock.mock(/\/api\/user/igs,{
    //     username:"老陈",
    //     age:18,
    //     gender:"男",
    //     type:"帅"
    // })
    
    //可以不写死数据用随机数
    Mock.mock(/\/api\/user/igs,{
       username:"老陈",
       "mtime":"@datetime",
       "score|1-800":800,
       "rank|1-100":100,    //这些是随机数
       "nickname":"@cname",
       "address":"@url",
       "imgUrl":"@image",
       'email':"@email"
    })
    

    最后

    import {getBannerData, getUserData} from '../api/data.js'
    async mounted() {
        // let res = await getBannerData()
        // console.log(res)
        let result = await getUserData()
        console.log(result)
      }
    

    相关文章

      网友评论

          本文标题:mockjs模拟后端数据实现前后端同时开发

          本文链接:https://www.haomeiwen.com/subject/dptcohtx.html