操作步驟：
首先介紹一下項目的結(jié)構(gòu)：將本地的json文件放在最外層和index.html在一起，姑且叫做 ? data.json。
我的json數(shù)據(jù)文件大概如此：
{
????"seller": {
????????"name":"粥品香坊（回龍觀）",
????????"description":"蜂鳥專送",
????????"bulletin":"會指定餐飲服務(wù)商。",
????????"avatar":"http://static.galileo.xiaojukeji.com/static/tms/seller_avatar_256px.jpg",
????},
????"goods": [
????????{
????????????"name":"熱銷榜",
????????????"type": -1
????????},
????????{
????????"name":"熱銷榜",
????????"type": -1
????????}
],
"ratings": [
????????{
????????????"username":"3******c",
????????????"avatar":"http://static.galileo.xiaojukeji.com/static/tms/default_header.png",
? ?????????"recommend": [
????????????????"南瓜粥",
????????????????"皮蛋瘦肉粥"
????????????]
????????},
????????{
????????????"username":"2******3",
????????????"avatar":"http://static.galileo.xiaojukeji.com/static/tms/default_header.png",
????????????"recommend": [
????????????????????"扁豆?fàn)F面"
????????????]
????????}
????]
}
2墓懂、接著在build的dev-server.js中進(jìn)行加入代碼：
//模擬服務(wù)器返回數(shù)據(jù)--開始
var appData = require('../data.json');
var seller = appData.seller;
var goods = appData.goods;
var ratings = appData.ratings;
var apiRoutes = express.Router();
apiRoutes.get('/seller',function(req, res) {
????res.json({
????????errno: 0,
????????data: seller
????});
});
apiRoutes.get('/goods',function(req, res) {
????res.json({
????????errno: 0,
????????data: goods
????});
});
apiRoutes.get('/ratings',function(req, res) {
????res.json({
????????errno: 0,
????????data: ratings
????});
});
app.use('/api', apiRoutes);
//模擬服務(wù)器返回數(shù)據(jù)--結(jié)束
3、使用axios獲取這些數(shù)據(jù)，并使用
exportdefault{
data () {
return{
seller: {}
};
},
created(){
axios.get('api/guocan').then(function (response) {
console.log(response.data);
})
}
};
解釋下以上代碼：
1》首先請求根目錄下的data.json文件顶捷，獲取到文件內(nèi)容并將其賦值給appData變量，然后獲取其中的各個字段數(shù)據(jù)屎篱，分別定義變量seller服赎、goods,ratings來賦值。
2》之后交播，通過express提供的Router對象及其一些方法（這里用的get方法）來設(shè)置接口（請求路徑）以及請求成功后的回調(diào)函數(shù)來處理要返回給請求端的數(shù)據(jù)重虑。（errno這個類似以js請求中的code值）
3》最后，我們要“使用”這個Router對象秦士，為了統(tǒng)一管理api接口缺厉，我們在要請求的路由前邊都加上‘a(chǎn)pi/'來表明這個路徑是專門用來提供api數(shù)據(jù)的。在這個“接口”中隧土，當(dāng)我們訪問“http://localhost:8080/api/sites”路徑的時候提针，就會返回db.json里的sites對象給我們。
