在使用vue時(shí)，當(dāng)我們?cè)诒镜啬Mapi調(diào)用服務(wù)器中的數(shù)據(jù)時(shí)，假設(shè)我們本地的數(shù)據(jù)存放在一個(gè)data.json的數(shù)據(jù)文件中，我們要通過vue-resouce（或者使用axios）調(diào)用api的形式使用這個(gè)文件中數(shù)據(jù)，我們可以使用node的路由Router來模擬路由調(diào)用。
在webpack項(xiàng)目中，內(nèi)設(shè)了node，我們可以在build文件夾下的dev-server.js中找到node的框架express，（dev-server.js是webpack的入口文件），通過express.Router()來定義路由。至于data.json這個(gè)文件，我們可以直接require(‘相對(duì)路徑/data.json’)獲取到這個(gè)文件下的全部數(shù)據(jù)對(duì)象。
具體例子如下：
在build -> dev-server.js進(jìn)行編寫
//1、引入data.json數(shù)據(jù)文件
var appData = require(‘相對(duì)路徑/data.json’);
//通過appData.xxx獲取到每個(gè)獨(dú)立的子對(duì)象
var objectA = appData.objectA;
var objectB = appData.objectB;
var objectC = appData.objectC;
//2、使用路由Router()
var apiRoutes = express.Router();
apiRoutes.get(‘/objectA’,function(req,res){
res.json({
type:0,
data:objectA
})
});
apiRoutes.get(‘/objectB’,function(req,res){
res.json({
type:0,
data:objectB
})
});
apiRoutes.get(‘/objectC’,function(req,res){
res.json({
type:0,
data:objectC
})
});
app.use(‘/api’,apiRoutes);//所有url以/api開始的，都會(huì)分配到apiRoutes這個(gè)對(duì)象中
如果我們直接在瀏覽器url中訪問這個(gè)localhost:8080/api/objectA就會(huì)返回請(qǐng)求的數(shù)據(jù)（json格式），但瀏覽器并不能格式化json格式，所以當(dāng)我們使用Google的chrome瀏覽器，我們可以安裝它的插件來格式化json數(shù)據(jù)（jsonview插件）。
前面我們?cè)O(shè)定好了路由，接下來，我們就是使用路由，vue以前是使用vue-resouce來訪問服務(wù)器的，但在vue2.0之后，停止了更新vue-resouce，轉(zhuǎn)而使用axios插件，對(duì)于axios我在這里不多說，我就說一下使用vue-resouce,它非常易上手，官方文檔詳細(xì)。
我們可以使用this.$http.get(‘/api/objectA’).then((response) => {
//第一個(gè)函數(shù)是成功的返回函數(shù)
response= response.body();
if(response.type=0){
this.objectA = response.objectA
}
},(err) => {
//第二個(gè)是失敗的返回函數(shù)
})
