json-server基本使用


 作為一個前端開發工程師,在后端還沒有ready的時候,不可避免的要使用mock的數據。很多時候,我們並不想使用簡單的靜 態數據,而是希望自己起一個本地的mock-server來完全模擬請求以及請求回來的過程。json-server是一個很好的可以替 我們完成這一工作的工具。

1.安裝json-server
cnpm install json-server -g

   2.新建一個data文件夾

 3.在data中創建一個datajson的文件
{
     "data":[]
}

  4.啟動json-server

json-server data.json

  

 控制台會輸出一下信息表名json-server啟動成功
 Loading data.json
 Done

 Resources
 http://localhost:3000/data

 Home
 http://localhost:3000

 Type s + enter at any time to create a snapshot of the 
 database

 訪問地址為:http://localhost:3000/data

  5.增加數據

 axios({
     method:"post",
     url:"http://localhost:3000/data",
     data:{
       username:"Yi只猴",
       age:18
     }
   }).then((data)=>{
     console.log(data)
   })

  

6.刪除某一條
  axios({
     method:'delete',
     url:'http://localhost:3000/data/1'//直接寫ID即可
   }).then((data)=>{
     console.log(data)
   })

  7

7.修改數據
  axios({
      method:"patch",
      url:"http://localhost:3000/data/3",//ID
      data:{
        username:'嘻嘻' //要修改成什么
      }
   }).then((data)=>{
     console.log(data)
   })

  

8.查找所有

  axios({
      method:"get",
      url:"http://localhost:3000/data", 
  }).then((data)=>{
     console.log(data)
   )

  

9.查找指定某一條

axios({
      method:"get",
      url:"http://localhost:3000/data/3", 
   }).then((data)=>{
     console.log(data)
   })

  

10.根據給定的name查找

axios({
      method:"get",
      url:"http://localhost:3000/data?username=小猴", 
  }).then((data)=>{
     console.log(data)
  })

  

11.模糊查詢

axios({
     method:"get",
     url:"http://localhost:3000/data?q=猴", 
  }).then((data)=>{
    console.log(data)
  })

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM