前端使用mock工具模拟接口联调

实际开发过程中,前端一般需要依赖数据模型来组织页面与组件中的交互流程 ,而数模型又依赖着后端提供的 API 接口。在后端还没能提供接口进行联调时,我们可以使用Mock工具来模拟接口进行联调,以便快速进行前后端分离,而不至于傻傻等着后端。

步骤如下:

        step1: 安装mock依赖   npm install  mockjs --save

            

    step2: 在项目src文件夹下新建mock文件夹,在mock文件夹中新建custTag.json文件和mockServe.js文件


    step3: custTag.json文件里写mock数据源

    

  step4: mockServe.js文件中通过mockjs插件来模拟数据

    

  step5: main.js文件引入mockServe

    

step6:定义api接口请求方法


  step7:在需要的页面调用step6的方法即可


   tips:mock数据里若有图片资源,则需要把图片资源放在public文件夹中,这样打包也不会有影响。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容