apifox mock 假数据

网站地址： 

Apifox - API 文档、调试、Mock、测试一体化协作平台。拥有接口文档管理、接口调试、Mock、自动化测试等功能，接口开发、测试、联调效率，提升 10 倍。最好用的接口文档管理工具，接口自动化测试工具。https://apifox.com/

我们下载好，也可以直接使用网页，打开软件 进入主页 我们可以看见这个界面

第一步 我们进入页面

第二步  添加项目

第三步   在未命名接口的位置 写你要模拟的昵称方便后期查找，

             可以点击get 切换请求方式，

             后边的按钮有模拟请求链接，可以直接使用，也可以有自己的，

              然后点击保存，再点击设计 

第四步  保存 设计后可以在下边写模拟的数据   

模拟name  id   url 都可以  可以在中文的地方写内容 或者 粘贴路径

第五步  核对数据 在右上点mock数据

第六步  在页面点击mock 数据  然后可以复制链接 使用

最后代码测试

<template><div>nihao ceshizhou{{this.list}}</div>
</template>
<script>
import axios from 'axios';
import * as echarts from "echarts";
export default {data() {return {list:[]};},// 实例化  进入页面 就开始数据请求mounted() {this.mock()},methods: {mock(){// console.log('nihap')axios.post("https://m1.apifoxmock.com/m2/4157526-3796824-default/364518677") //路径换成自己的.then(response => {    //监听返回// 先定义值 再从后端进行数据获取 替换console.log(response, '退出');this.list = response.data}).catch(error => {console.log(error, '失败');});}}
};
</script>

页面效果