vueシミュレーションバックグラウンドデータ
5670 ワード
VUEはローカルデータを要求する構成を開発し、初期のvue-licの下にdev-serverがある.jsとdev-client.jsの2つのファイルは、dev-serverでローカルデータを要求します.jsでは、最新のvue-webpack-templateからdev-serverが削除されました.jsとdev-client.jsはwebpackに変更しました.dev.conf.jsが代わるので、webpackにローカルアクセスを構成する.dev.conf.jsで構成すればいいです.
1、旧版dev-server.jsローカルデータアクセスの構成:
2、新版webpack.dev.conf.jsローカルデータアクセスの構成:
以上はgetリクエストで、postの設定方法を聞いて、POSTリクエストを補充します.
1、旧版dev-server.jsローカルデータアクセスの構成:
const app = express() ,const compiler = webpack(webpackConfig) ,
var appData = require('../data.json')
var seller = appData.seller
var goods = appData.goods
var ratings = appData.ratings
var foods = appData.foods
var pice = appData.pice
var apiRoutes = express.Router()
apiRoutes.post('/foods', function (req, res) {
res.json({
errno: 0,
data: foods
});
})
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
});
})
apiRoutes.get('/pice', function (req, res) {
res.json({
errno: 0,
data: pice
});
})
app.use('/api',apiRoutes)
2、新版webpack.dev.conf.jsローカルデータアクセスの構成:
const portfinder = require(‘portfinder’)
//
const express = require('express')
const app = express()
var appData = require('../data.json')//
var seller = appData.seller//
var goods = appData.goods
var ratings = appData.ratings
var apiRoutes = express.Router()
app.use('/api', apiRoutes)
// devServer,
before(app) {
app.get('/api/seller', (req, res) => {
res.json({
errno: 0,
data: seller
})// json , seller data
}),
app.get('/api/goods', (req, res) => {
res.json({
errno: 0,
data: goods
})
}),
app.get('/api/ratings', (req, res) => {
res.json({
errno: 0,
data: ratings
})
})
} , before, 。
以上はgetリクエストで、postの設定方法を聞いて、POSTリクエストを補充します.
:
apiRoutes.post('/foods', function (req, res) { // post
res.json({
errno: 0,
data: foods
});
})
:
app.post('/api/foods', function (req, res) { // post
res.json({
errno: 0,
data: foods
});
})
:
created () {
this.$http.post('http://localhost:8080/api/foods').then((response) => {
console.log(response)
})
}