vue配置请求本地json数据的方法

Vue配置本地JSON数据请求的方法：长沙网络推广实践分享

今天，我将向大家分享一种在Vue中配置请求本地JSON数据的方法。这种方法对于长沙网络推广来说非常实用，也为大家提供一个参考。

在项目的build文件夹下找到webpack.dev.conf.js文件。在引入portfinder模块后，我们需要添加以下代码来引入express模块并设置本地数据：

```javascript

const express = require('express');

const app = express();

const appData = require('../data.json'); // 加载本地json文件

const seller = appData.seller; // 获取对应本地数据

const goods = appData.goods;

const ratings = appData.ratings;

const apiRoutes = express.Router();

app.use('/api', apiRoutes);

```

接下来，我们找到devServer并在其中添加以下代码来创建接口并返回本地数据：

```javascript

before: function (app) {

app.get('/api/seller', function (req, res) {

res.json({ errno: 0, data: seller }); // 接口返回json数据，seller为配置好的本地数据

});

app.get('/api/goods', function (req, res) {

res.json({ errno: 0, data: goods }); // 接口返回json数据，goods为配置好的本地数据

});

app.get('/api/ratings', function (req, res) {

res.json({ errno: 0, data: ratings }); // 接口返回json数据，ratings为配置好的本地数据

});

}

```这样我们就配置好了本地的接口。接下来，在项目中通过发送请求访问这些接口即可获取本地数据。以下是一个示例脚本：

```html