Mock.js

Mock js~

(反正我是在网上看了好多怎么弄的,发现有点乱,各有各的方法,后面自己突然捣鼓好了,发现Mockjs用法并不难,自己的这种使用也很方便快捷)

什么是Mock js

是一种用于先与后端分离关系,在后端没写好数据返回接口的时候,自己通过设置Mock js随机生成自己需要的数据,同时自己可以设置链接进行数据传回使用。等后端开发好接口以后,直接将链接进行覆盖原始链接就好了。

现在讲述Mock.js怎么配置以及使用

在自己搭建的文件夹里面进入命令行输入:npm install mockjs;
然后直接进入到自己需要获取数据的组件里面,比如一个表格组件需要获取20条数据,就进入到table.vue然后

<script>
  import axios from "axios"//引入vue-axios包,当然前提是需要安装组件并且使用
  var Mock=require("mockjs")//引入已经装好的Mockjs包,位置在node_modules/mockjs
  Mock.mock('http://zchuhyy',{
      'user|20-30':[{       //随机生成20~30条的用户数据
          'name':'@cname',
        'age|1-100':100,

        'birthday':'@date("yyyy-MM-dd")',
        'city':'@city(true)'
      }]
  });
  //使用mock语法,对其进行命名链接,并开始对属性进行命名,声明属性规则,以及属性值定义
  axios.get('http://zchuhyy').then(response=>{
      console.log(response.data);//通过axios实现Ajax的数据传输,同时将数据输出到控制台,从而得到了数据
  }).catch(error=>{
      alert(123);
  })
</script>

控制台输出:

语法规则详解见文档;

官方文档

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容