javascript - 如何使用 express、axios 和 react 更新 json 文件？

Question

我一直在使用 json-server，它在设置我的应用程序以获取数据方面非常出色。我现在想用它做更多的事情，所以我使用 express 以便在需要时可以做一些“后端逻辑”。

但我正在为如何使用 json 数据文件而苦苦挣扎

到目前为止我有这个:

app.get("/basket", function(req, res) {
  var basket = [
    {name: 'football', id:'spo-001', category: 'sport', quantity: 1, price: 80},
    {name: 'cricket ball', id:'spo-002', category: 'sport', quantity: 1, price: 10},
    {name: 'atlas', id:'geo-001', category: 'geog', quantity: 1, price: 50}
  ]
  res.status(200).send(basket);
})

所以当我点击这条路线时，我可以取 repo 物车数据，然后在我的 react/redux 应用程序中，我增加其中一个的数量，然后立即更新后端(json-server)，所以当我刷新页面，我的数据仍然存在。

但是，我有点不知道如何使用 express.json 文件。我刚找到这个 server.use('/api', jsonServer.router('db.json'));

然后我怎样才能像这样使用这里的 json 数据:

app.get("/basket", function(req, res) {

  res.status(200).send(sendBackTheDataFromTheJsonFile);
})

Answer 1

使用fs模块读取json文件。

const fs = require('fs');


app.get("/basket", function(req, res) {
  fs.readFile('db.json', 'utf8', function (err, data) {
    if (err) throw err;
     let dbData = JSON.parse(data);
     res.status(200).send(dbData);

  });
})

如果你想更新一个条目，做类似这样的事情:

 app.put("/basket", function(req, res) {
      fs.readFile('db.json', 'utf8', function (err, data) {
        if (err) throw err;
         let dbData = JSON.parse(data);
         // Update data here.
         // You will have to figure out how to do it yourself
         // After you have update the entry, write the entire array back to the json file.
         updatedJSONData = JSON.stringify(dbData)
         fs.writeFile('db.json', json, 'utf8', function(err, data) {
            if (err) throw err;
            // Do something here
             res.status(200).send("Basket was updated");

         } );

      });
    })

在您的 axios 方法中，您必须将 url 指定为 /basket 并且该方法应该是 put