VUE开辟要求当地数据的设置.webpack.dev.conf.js

1.webpack.dev.conf.js设置当地数据接见
a.在const portfinder = require(‘portfinder’)以后加：

var appData = require(‘../db.json’)//加载当地数据文件（db.json）
var getNewsList = appData.getNewsList//猎取对应的当地数据
var login = appData.login
var getPrice = appData.getPrice
var createOrder = appData.createOrder
找到devServer{}在内里增加：

before (app) {
app.get(‘/api/getNewsList’, (req, res) => {

res.json({
  data: getNewsList
})//接口返回json数据，上面设置的数据getNewsList就赋值给data要求后挪用

}),

app.get('/api/login', (req, res) => {
  res.json({
    data: login,
  })
}),
app.get('/api/getPrice', (req, res) => {
  res.json({
    data: getPrice
  })
}),
app.get('/api/createOrder', (req, res) => {
  res.json({
    data: createOrder
  })
})

}

db.json文件目次及内容：

{
“getNewsList”: [

{
  "id": 1,
  "title": "消息条目1消息条目1消息条目1消息条目1",
  "url": "http://starcraft.com"
},
{
  "id": 2,
  "title": "消息条目2消息条目2消息条目2消息条目2",
  "url": "http://warcraft.com"
},
{
  "id": 3,
  "title": "消息条3消息条3消息条3",
  "url": "http://overwatch.com"
},
{
  "id": 4,
  "title": "消息条4广告宣布",
  "url": "http://hearstone.com"
}

],
“login”: {

"username": "yudongdong",
"userId": 123123

},
“getPrice”: {

"amount": 678

},
“createOrder”: {

"orderId": "6djk979"

},
“getOrderList”: {

"list": [
  {
    "orderId": "ddj123",
    "product": "数据统计",
    "version": "高等版",
    "period": "1年",
    "buyNum": 2,
    "date": "2016-10-10",
    "amount": "500元"
  },
  {
    "orderId": "yuj583",
    "product": "流量剖析",
    "version": "户外版",
    "period": "3个月",
    "buyNum": 1,
    "date": "2016-5-2",
    "amount": "2200元"
  },
  {
    "orderId": "pmd201",
    "product": "广告宣布",
    "version": "商店版",
    "period": "3年",
    "buyNum": 12,
    "date": "2016-8-3",
    "amount": "7890元"
  }
]

}
}
2.组件内里：
created: function(){
this.$http.get(‘api/getNewsList’)

.then((res) => {
  this.newsList = res.data.data
  console.log(res.data)
  console.log(res.data.data)
  console.log(this.newsList)
}, (err) => {
  console.log(err)
})

}
重新启动：npm run dev

注重：
res.data 返回的是一个对象，res.data.data返回的是一个数组
（我当时这里在页面就是不出来数据，以后……….纠结了良久才晓得要如许的）
post要求：
app.post(‘/api/getNewsList’, (req, res) => {
res.json({

data: getNewsList

})
}),