Vue 通过json-server搭建本地接口数据

一、通过json-server搭建本地数据接口
1、在终端根目录下全局安装json-server依赖包(其实就是Win+R，输入cmd回车)，输入命令：npm install -g json-server
2、创建文件夹,即Hotel，初始化项目：
输入命令：npm init

把json-server存放到项目中，输入命令：npm install json-server --save


调整启动方式，即 json-server --watch db.json

创建 db.json 文件，文件名称可以随意命名，只要后缀为.json就行。里面存放需要的数组内容，如下：

{
  "users": [
    {
      "name": "小米",
      "phone": "333-444-555",
      "email": "xiaomi@gmail.com",
      "id": 1,
      "age": 30,
      "companyId": 1
    },
    {
      "name": "小皮",
      "phone": "333-444-555",
      "email": "xiaopi@gmail.com",
      "id": 2,
      "age": 33,
      "companyId": 2
    },
    {
      "name": "王莉莉",
      "phone": "333-444-555",
      "email": "wanlili@gmail.com",
      "id": 3,
      "age": 35,
      "companyId": 3
    },
    {
      "name": "张丽丽",
      "phone": "333-444-555",
      "email": "zhanglili@gmail.com",
      "id": 4,
      "age": 43,
      "companyId": 3
    }
  ],
  "companies": [
    {
      "id": 1,
      "name": "Apple",
      "description": "Apple is good!"
    },
    {
      "id": 2,
      "name": "Microsoft",
      "description": "Microsoft is good!"
    },
    {
      "id": 3,
      "name": "Google",
      "description": "Google is good!"
    }
  ]
}

启动，输入命令：npm run json:server

然后可以看到，自己写的数组，如下：

二、将jsonplaceholder所有数据拿到本地数据里面来。

启动，输入命令：npm run json:server:remote