vue 搭建模拟数据生成服务器--学习笔记

1、json-server搭建mock服务器--<1>

　　（1）全局安装json-server 

　　　　cnpm install json-server -g

　　（2）在项目的直接目录下创建mock的文件夹

　　（3）在mock的文件夹里面添加db.json的文件，并且在db.json的文件可以配置我们想要的json数据

　　　　比如：

　　　　　　

{
  "people": [
    { "id": 1, "name": "people1", "sex": "1" },
    { "id": 2, "name": "people2", "sex": "2" }
  ],
  "book": [
    { "id": 1, "bookName": "JavaScript高级程序设计", "author": "Nicholas C.Zakas" }
  ]
}

　　（4）在package.json的script中加入命令，之后可以直接运行

　　　　

  "mock": "json-server --watch mock/db.json",
  "mockdev": "npm run mock & npm run dev"

　　（5）运行： npm run mock

　　（6）访问http:localhost:3000/

　　（7）查看数据的接口就是之前写在db,json中的数据的名称

　　　　比如： http:localhost:3000/people    就可以查看people中的数据

　　（8）不足：数据是自己手动添加的，比较麻烦

2、json-server搭建mock服务器--<2>

      （1）（2）步同上

　　（3）安装faker： cnpm install faker --save-dev

　　（4）在mock文件夹下创建faker-data.js的文件，并在文件中生成自己想要的数据

　　　　 

module.exports = function () {
    var faker = require("faker");
    faker.locale = "zh_CN";
    var _ = require("lodash");
    console.info(faker.random.uuid())
    return {
        people: _.times(100, function (n) {
            return {
                id: n,
                name: faker.name.findName(),
                avatar: faker.internet.avatar()
            }
        }),
        address: _.times(100, function (n) {
            return {
                id: faker.random.uuid(),
                city: faker.address.city(),
                county: faker.address.county(),
                streetName: faker.address.streetName()
            }
        })
    }
}

　　（5）在package.json的script中加入命令，之后可以直接运行

　　　　

"faker": "json-server --watch mock/faker-data.js"

　　（6）运行： npm run  faker

　　（7）访问http:localhost:3000/

　　（8）查看数据的接口就是之前写在db,json中的数据的名称

　　　　比如： http:localhost:3000/people    就可以查看people中的数据

 3、在使用的时候，使用get能获取到数据，使用post会往数据里面添加数据，具体原因不清楚

学习该文章： http://www.jianshu.com/p/ccd53488a61b