Vue.js----vue中json-server的简单使用
json-server的简单使用:
1.全局安装:cnpm install json-server -g
2.创建文件夹/文件 server/data.json
在data.json文件中手动添加一些数据:例如:
{ "list":[ { "name":"苹果", "price":22 }, { "name":"香蕉", "price":30 }, { "name":"雪梨", "price":60 } ] }
3.在server文件夹内打开cmd命令窗口,运行json-server data.json;每当data.json文件手动改变,都得重新运行
4.增删改查: get 查,post 增,delete 删,patch 修改部分数据,put 全部数据替换
例如:
axios({ method:"get", url:"localhost:3000/list" }).then((data)=>{console.log(data)}) axios({ method:"post", url:"http://localhost:3000/list", data:{name:"苹果",price:"22"} }) axios({ method:"patch", url:"http://localhost:3000/list/1", data:{name:"脐橙"} })
其中常用的url的形式有:
全部数据: localhost:3000/list
指定id: localhost:3000/list/1
指定条件: localhost:3000/list?name=李四&name=张三
模糊查询: localhost:3000/list?q=张