axios基础(二):axios对服务器端进行增删改查的基本用法

简介: axios基础(二):axios对服务器端进行增删改查的基本用法

GET请求

// 给第一个btn绑定GET请求
btns[0].onclick = function() {
    axios({
        method: 'GET',
        url: "http://localhost:3000/posts/2"
    }).then((response) => {
        console.log(response);
    })
}

POST请求

// 给第二个按钮,绑定POST请求,既然是POST请求则需要请求体
btns[1].onclick = function() {
    axios({
        method: 'POST',
        url: "http://localhost:3000/posts",
        data: {
            title: "这是第三篇文章,菜根谭",
            author: "玩野猫"
        }
    }).then((response) => {
        console.log(response);
    })
}

PUT请求

// 给第三个按钮,绑定PUT请求,PUT请求可以理解为修改已有的数据  需要加id
btns[2].onclick = function() {
    axios({
        method: 'PUT',
        url: "http://localhost:3000/posts/3",
        data: {
            title: "朱元璋很好看",
            author: "刘伯温"
        }
    }).then((response) => {
        console.log(response);
    })
}

DELETE请求

// 给第四个按钮,绑定DELETE请求,需要加id
btns[3].onclick = function() {
    axios({
        method: 'delete',
        url: "http://localhost:3000/posts/3",
    }).then((response) => {
        console.log(response);
    })
}
相关文章
|
7月前
|
JSON 前端开发 JavaScript
3分钟让你学会axios在vue项目中的基本用法(建议收藏)
3分钟让你学会axios在vue项目中的基本用法(建议收藏)
462 0
|
2月前
|
SQL 分布式计算 Hadoop
Hadoop-37 HBase集群 JavaAPI 操作3台云服务器 POM 实现增删改查调用操作 列族信息 扫描全表
Hadoop-37 HBase集群 JavaAPI 操作3台云服务器 POM 实现增删改查调用操作 列族信息 扫描全表
38 3
|
2月前
|
分布式计算 Hadoop Shell
Hadoop-36 HBase 3节点云服务器集群 HBase Shell 增删改查 全程多图详细 列族 row key value filter
Hadoop-36 HBase 3节点云服务器集群 HBase Shell 增删改查 全程多图详细 列族 row key value filter
60 3
|
2月前
|
前端开发 JavaScript UED
axios取消请求CancelToken的原理解析及用法示例
axios取消请求CancelToken的原理解析及用法示例
143 0
|
3月前
|
JavaScript 前端开发
vue配合axios连接express搭建的node服务器接口_简单案例
文章介绍了如何使用Express框架搭建一个简单的Node服务器,并使用Vue结合Axios进行前端开发和接口调用,同时讨论了开发过程中遇到的跨域问题及其解决方案。
66 0
vue配合axios连接express搭建的node服务器接口_简单案例
|
6月前
|
JSON 前端开发 JavaScript
前端Ajax、Axios和Fetch的用法和区别笔记
前端Ajax、Axios和Fetch的用法和区别笔记
115 2
|
5月前
|
JavaScript API
前后端数据交互.js文件的axios的写法,想要往后端发送数据,页面注入API,await的意思是同步等待服务器数据,并返回,axios注入在其他页面,其他页面调用的时候,同步作用
前后端数据交互.js文件的axios的写法,想要往后端发送数据,页面注入API,await的意思是同步等待服务器数据,并返回,axios注入在其他页面,其他页面调用的时候,同步作用
|
7月前
|
缓存 JavaScript 前端开发
Axios 高阶技巧大揭秘:进阶用法与性能优化
Axios 高阶技巧大揭秘:进阶用法与性能优化
357 0
|
数据处理
Axios 默认配置 简化URL 简化代码 多台服务器接口配置
Axios 默认配置 简化URL 简化代码 多台服务器接口配置
|
JSON 前端开发 API
从零开始学习React-axios获取服务器API接口(五)
从零开始学习React-axios获取服务器API接口(五)
101 0