本地修改json数据json-server_jsonserver.create() 不能修改数据-CSDN博客

本文链接：https://blog.csdn.net/weixin_43456275/article/details/124022803

本文介绍了如何使用axios库在Node.js环境中与JSON Server配合，实现HTTP接口，进行数据的CRUD操作，包括获取列表、新增记录、删除指定项和更新数据。适合学习前后端分离和API接口开发的基础实践。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文章目录

环境
获取
新增
删除
更新

环境

npm install -g json-server
npm install axios
新建db.json
json-server --watch db.json

获取

    getList() {
      this.$axios
        .get("http://localhost:3000/posts")
        .then(function (response) {
          console.log("getList", response.data);
        })
        .catch(function (error) {
          console.log(error);
        });
    },

新增

    addData() {
      let params = {
        id: 2,
        title: "aaa",
        author: "bbb",
      };
      this.$axios
        .post("http://localhost:3000/posts", params)
        .then(function (response) {
          console.log("getList", response);
        })
        .catch(function (error) {
          console.log(error);
        });
    },

删除

	//通过id 删除（传id为2）
    deleteData() {
      this.$axios
        .delete("http://localhost:3000/posts/" + 2)
        .then(function (response) {
          console.log("getList", response);
        })
        .catch(function (error) {
          console.log(error);
        });
    }

更新

	//更新的ID传2  吧更新的数据的id 改为5,实际只会更新除了ID的其他字段
	updateData() {
      let params = {
        id: 5,
        title: "555",
        author: "444",
      };
      this.$axios
        .put("http://localhost:3000/posts/" + 2, params)
        .then(function (response) {
          console.log("getList", response);
        })
        .catch(function (error) {
          console.log(error);
        });
    }