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=张


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM