JSON Server Vue 是一款方便快捷的前端開發工具，它將前端工作與后端分離，使用 JSON 數據作為數據存儲，打造出了一套簡單易用的模擬數據服務。下面我們來介紹一下如何使用 JSON Server Vue。

首先，我們需要安裝 JSON Server Vue。使用命令行工具進入我們的項目目錄下，并輸入以下命令：

npm install --save json-server-vue

接著，我們需要在項目中創建一個db.json文件，用于存儲我們的模擬數據。例如：

{
"users": [
{
"id": 1,
"name": "Tom",
"age": 24
},
{
"id": 2,
"name": "Jerry",
"age": 25
},
{
"id": 3,
"name": "Alice",
"age": 26
}
]
}

然后，我們需要在我們的main.js文件中引入 JSON Server Vue，并啟動服務，并將端口設置為3000。代碼如下：

import Vue from 'vue'
import App from './App.vue'
import JsonServerVue from 'json-server-vue'
Vue.config.productionTip = false
const jsonServerVue = new JsonServerVue({
port: 3000,
data: 'db.json'
})
jsonServerVue.start()
new Vue({
render: h =>h(App),
}).$mount('#app')

現在，我們的 JSON Server Vue 已經啟動，并運行在localhost:3000端口上。我們可以發送 GET、POST、PUT、DELETE 等請求來操作模擬數據。例如，我們使用 Vue Resource 向 /users 增加一條記錄的代碼如下：

Vue.http.post('/users', {
name: 'Bob',
age: 27
}).then(response =>{
console.log(response.body)
})

總的來說，JSON Server Vue 是一款快速、簡單、輕量的模擬數據服務，它可以讓我們更加專注于前端開發工作，提高開發效率和開發體驗。。