axios封装需要注意的增删改查传参易混淆点

最新推荐文章于 2023-08-14 19:24:46 发布
最新推荐文章于 2023-08-14 19:24:46 发布
阅读量209 收藏 1
点赞数
文章标签： 前端 javascript vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_74086230/article/details/128366631
版权

1.查询get : 请求行传参        axios.get('/路径',{params:{参数名:参数值}})

2.新增post : 请求体传参       axios.post('/路径',{参数名:参数值})  

3.全部更新put : 请求体传参        axios.put('/路径',{参数名:参数值})   

4.局部更新patch : 请求体传参        axios.patch('/路径',{参数名:参数值})   

5.删除delete : 请求行/请求体传参

        5.1请求行: axios.delete('/路径',{params:{参数名:参数值}})

        5.2请求体: axios.delete('/路径',{data:{参数名:参数值}})

Lauv-
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Axios 进一步封装 get、post、delete等方法
weixin_44832362的博客
02-28 720
Axios 进一步封装 get、post、delete等方法
axios请求方式delete根据id和请求参数删除数据
最新发布
m0_72929120的博客
10-19 955
【代码】axios请求方式delete根据id和请求参数删除数据。
1、Axios网络请求完整封装及使用（重点）
qq_57676486的博客
07-05 1013
在日常应用过程中，一个项目中的网络请求会很多，此时封装：将实现相同功能的放在一起，后期找起来方便axiosaxios。
axios 最详细封装
热门推荐
m0_58481462的博客
08-17 4万+
axios 最详细封装
axios取消重复类型请求的封装
温壁
11-03 431
axios取消请求的封装
前后端 spring+vue 实现后台系统的增删改查
07-17
注意啊，这个项目只能实现增删改查功能，以及基本的分页功能，之后的登录，注册跳转到后台还有点问题(尽情期待)
axios详解-轻松搞定CRUD：掌握Axios实现增删改查功能的精髓
08-16
在处理axios请求时，Controller会解析请求参数，调用Service进行业务处理，最后将结果封装成JSON格式并通过Response对象返回给axios。 ### 结论 axios作为强大的HTTP客户端，简化了前端与后端的通信，配合Spring ...
vue的增删改查
11-19
在Web开发中，"增删改查"（CRUD）是基本操作，对于任何数据驱动的应用来说都是核心功能。Vue.js 提供了丰富的特性来支持这些操作，使得在Vue项目中实现CRUD变得简单高效。 1. **创建（Create）**： 在Vue中创建新...
vue后台管理项目增删改查规范代码
08-24
Vue.js 是一个流行的前端JavaScript框架，...以上就是基于Vue.js和Element UI的后台管理项目中增删改查功能的实现方式以及代码规范的相关知识点。通过这些技术，开发者可以构建出高效、易用且可维护的后台管理系统。
Vs Code Vue实现增删改查
01-07
4. **创建Vue组件**：为增删改查功能，我们需要创建几个组件，如`List.vue`（展示数据列表）、`Form.vue`（添加和编辑表单）、`Dialog.vue`（确认对话框）。每个组件都有自己的模板、脚本和样式。 5. **数据绑定**...
axios delete传参_Vue开发问题（axios封装）
weixin_39969340的博客
11-22 889
关于Vue开发的问题（axios封装）在博客中查找vue的axios封装，发现其中案例还是很多的，自己项目中有些需求不够。比如1、Content-Type 请求头 application/x-www-form-urlencoded和application/json两种方式的应用2、请求方式增加delete方式，3、出现跨域，以及其他问题。做了些修改。做个记录首先放出引用的源代码引用来源于 vue ...
axios中的GET POST PUT PATCH，发送请求时params和data的区别
m0_49515138的博客
02-15 946
最近突然发现post请求可以使用params方式传值，然后想总结一下其中的用法。
pc和uniapp，封装axios以及增删改查请求
csdnyp的博客
10-24 266
代码
Vue+Axios+SSM框架实现增删改查与文件上传
只为code醉的博客
12-17 2065
链接：https://pan.baidu.com/s/163wHTpcdLdOfCUSg1PqMgg?pwd=4fb1提取码：4fb1--来自百度网盘超级会员V3的分享。
axios的增删改查
li19980的博客
08-14 239
【代码】axios的增删改查。
Vue(第十七课)AXIOS对JSON数据的增删改查
qq_56248592的博客
12-04 3059
Vue中的axios数据的增删改查
使用axios对数据库进行增删改查
weixin_51504215的博客
04-08 702
值得注意的是，请求发送时，数据怎么怎么跟着发送过去的。以及数据格式要如何对应上去。这里我就用前端代码演示一下增删改查数据提交格式，需要源码的后台私信我。
实现简单的axios异步增删改查功能
Goaread的博客
07-01 2925
手动实现一个简单的 axios 增删改查的功能封装，实现非 rest API 接口的数据请求，数据的模拟用 json-server 来实现 预备数据 首先，全局安装 json-server npm install -g json-server 在本地建立 db.json 文，并填充数据 { "posts": [ {"id": 1, "title": "json-server", "author": "typicode"}, {"id": 2, "title": "jso.
axios封装与api接口管理
田兴的博客
09-14 3823
一、前言 axios的封装和api接口的统一管理，其实主要目的就是在帮助我们简化代码和利于后期的更新维护。 在vue项目中，和后台交互获取数据这块，我们通常使用的是axios库，它是基于promise的http库，可运行在浏览器端和node.js中。他有很多优秀的特性，例如拦截请求和响应、取消请求、转换json、客户端防御XSRF等。所以我们的尤大大也是果断放弃了对其官方库vue-resource的维护，直接推荐我们使用axios库 二、axios封装步骤 安装axios npm instal
axios 封装增删改查用户api
04-07
这里提供一个基于axios的增删改查用户api的封装示例： ```javascript import axios from 'axios'; const BASE_URL = 'https://example.com/api'; // 获取用户列表 export const getUsers = () => { return axios.get(`${BASE_URL}/users`); }; // 获取单个用户信息 export const getUser = (userId) => { return axios.get(`${BASE_URL}/users/${userId}`); }; // 创建用户 export const createUser = (userData) => { return axios.post(`${BASE_URL}/users`, userData); }; // 更新用户信息 export const updateUser = (userId, userData) => { return axios.put(`${BASE_URL}/users/${userId}`, userData); }; // 删除用户 export const deleteUser = (userId) => { return axios.delete(`${BASE_URL}/users/${userId}`); }; ``` 使用方法： ```javascript import { getUsers, getUser, createUser, updateUser, deleteUser } from './userApi'; // 获取用户列表 getUsers() .then((response) => { console.log(response.data); }) .catch((error) => { console.error(error); }); // 获取单个用户信息 getUser('user123') .then((response) => { console.log(response.data); }) .catch((error) => { console.error(error); }); // 创建用户 const userData = { name: '张三', age: 30 }; createUser(userData) .then((response) => { console.log(response.data); }) .catch((error) => { console.error(error); }); // 更新用户信息 const updatedUserData = { name: '李四', age: 35 }; updateUser('user123', updatedUserData) .then((response) => { console.log(response.data); }) .catch((error) => { console.error(error); }); // 删除用户 deleteUser('user123') .then((response) => { console.log(response.data); }) .catch((error) => { console.error(error); }); ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值