json-server的入门

由于前端开发的时候，需要向后端请求数据，有的时候后端还没有准备好，所以需要使用一些简单的静态数据，但是我们更加希望能够模拟请求以及请求回来的过程，这个时候就需要使用json-server

Json-Server的介绍

json-server是一个 Node 模块，运行 Express 服务器，你可以指定一个 json 文件作为 api 的数据源。 通俗来说， json-server模拟服务端接口数据，一般用在前端人员可以不依赖后端的API开发，而在本地搭建一个JSON服务，快速生成一个REST API风格的后端服务。

Json-Server的下载与安装

npm install -g json-server

Json-Server的使用

我已经在本地启动了一个vue2项目，现在要做的就json-server的使用了

1. 新建一个data文件夹，在该文件夹中新建data.json文件，然后在json中新建数据
   
   这个里面就是模拟数据的json文件，json数据其实跟我们原来的对象很像，差别在于它里面只能用双引号，不能用单引号，数字布尔值不用加引号，每一项的最后一项不能加逗号；如下

{"userList":[{"title":"拜登打算宣布不使用核武器","user":"张三","date":"2021-8-8","id":"1" ,"check":false},{"title":"中国健儿夺金高燃瞬间回顾","user":"李四","date":"2021-9-9","id":"2" ,"check":true},{"title":"全国热力地图出炉","user":"张三","date":"2021-8-8","id":"3" ,"check":false},{"title":"美国驻华大师专家分析","user":"张三","date":"2021-8-8","id":"4" ,"check":false},{"title":"安德鲁王子遭起诉","user":"环球网","date":"2021-8-11","id":"5" ,"check":true}]
}

2. 在data文件下面打开命令行工具，执行

json-server --watch data.json -p 3009

-p是端口号，随便写

出现笑脸说明数据启动成功，可以直接在浏览器端使用

2. 在组件中写入created或者mounted，在这个里面发送axios请求，在组件中导入axios请求
   
   然后启动项目，在控制台中就会打印出来