在build文件夾下找到webpack.dev.conf.js文件,在const portfinder = require('portfinder')后添加
const express = require('express') const app = express() const appData = require('../data.json') // 加載本地json文件 const seller = appData.seller // 獲取對(duì)應(yīng)本地?cái)?shù)據(jù) const goods = appData.goods const ratings = appData.ratings const apiRoutes = express.Router() app.use('/api',apiRoutes)
然后找到devServer,插入以下代碼:
//然后找到devSeerver,在里面添加 before (app) { app.get('/api/seller',(reg,res) => { res.json({ errno: 0, data: seller }) // 接口返回json數(shù)據(jù),上面配置的數(shù)據(jù)seller就復(fù)制給data請(qǐng)求后調(diào)用 }), app.get('/api/goods',(reg,res) => { res.json({ errno: 0, data: goods }) // 接口返回json數(shù)據(jù),上面配置的數(shù)據(jù)goods就復(fù)制給data請(qǐng)求后調(diào)用 }), app.get('/api/ratings',(reg,res) => { res.json({ errno: 0, data: ratings }) // 接口返回json數(shù)據(jù),上面配置的數(shù)據(jù)ratings就復(fù)制給data請(qǐng)求后調(diào)用 }) }
請(qǐng)求訪問(wèn)
<script> import header from './components/header/header.vue' const ERR_OK = 0 export default { data () { return { seller: {} } }, created () { this.$http.get('/api/seller').then((response) => { response = response.body; // 獲取到數(shù)據(jù) if (response.errno === ERR_OK) { this.seller = response.data; console.log(this.seller); } }) }, components: { 'v-header': header } } </script>
最后重新啟動(dòng)項(xiàng)目即可訪問(wèn)npm run dev
相信看了本文案例你已經(jīng)掌握了方法,更多精彩請(qǐng)關(guān)注Gxl網(wǎng)其它相關(guān)文章!
推薦閱讀:
pandas中的Dataframe查詢有哪些方法
python怎樣實(shí)現(xiàn)百度語(yǔ)音識(shí)別api的步奏詳解
聲明:本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com