vue.js如何加載本地json文件
這篇文章主要介紹了vue.js如何加載本地json文件的相關(guān)知識，內(nèi)容詳細(xì)易懂，操作簡單快捷，具有一定借鑒價值，相信大家閱讀完這篇vue.js如何加載本地json文件文章都會有所收獲，下面我們一起來看看吧。
為霍林郭勒等地區(qū)用戶提供了全套網(wǎng)頁設(shè)計制作服務(wù)，及霍林郭勒網(wǎng)站建設(shè)行業(yè)解決方案。主營業(yè)務(wù)為成都網(wǎng)站建設(shè)、做網(wǎng)站、霍林郭勒網(wǎng)站設(shè)計，以傳統(tǒng)方式定制建設(shè)網(wǎng)站，并提供域名空間備案等一條龍服務(wù)，秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務(wù)。我們深信只要達(dá)到每一位用戶的要求，就會得到認(rèn)可，從而選擇與我們長期合作。這樣，我們也可以走得更遠(yuǎn)！
整個項目是由webpack打包而成。具體項目結(jié)構(gòu)如下：
1：打包好的文件在此
2：我們找到bulid>dev-server.js,然后打開
3：在里面加入這段代碼，大概在17行）。
var app = express() //從這后面開始加
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,
datta:ratings
});
});
app.use('/api',apiRoutes);4：使用方法：
你可以在瀏覽器地址欄填寫http://localhost:8080/api/seller 或者h(yuǎn)ttp://localhost:8080/api/goods 或者h(yuǎn)ttp://localhost:8080/api/ratings 查看數(shù)據(jù)
因為加載的json數(shù)據(jù)沒有格式，看起來很亂，所以我們可以使用谷歌的擴(kuò)展程序JSONView。
貼上讀取數(shù)據(jù)的頁面
關(guān)于“vue.js如何加載本地json文件”這篇文章的內(nèi)容就介紹到這里，感謝各位的閱讀！相信大家對“vue.js如何加載本地json文件”知識都有一定的了解，大家如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
當(dāng)前名稱：vue.js如何加載本地json文件
鏈接地址：http://m.jiaotiyi.com/article/pjhehd.html