Ajax-02.Axios

news2024/11/16 1:48:32

Axios入门

        1.引入Axios的js文件

        <script src="js/axios-0.18.0.js"></script>

Axios

    请求方式别名:

            axios.get(url[,config])

            axios.delete(url[,config])

            axios.post(url[,data[,config]])

            axios.put(url[,data[,config]])

    发送GET/POST请求

axios.get("https://mock.apifox.cn/m1/3128855-0-default/emp/list").then(result => {

    console.log(result.data)

});

axios.post("https://mock.apifox.cn/m1/3128855-0-default/emp/deleteById","id=1").then(result => {
    console.log(result.data)
});

 ​​​​​​

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ajax-Axios</title>
    <script src="js/axios.js"></script>
</head>
<!-- 
    Axios
    请求方式别名
    axios.get(url[,config])
    axios.delete(url[,config])
    axios.post(url[,data[,config]])
    axios.put(url[,data[,config]])
    发送GET请求
    axios.get("https://mock.apifox.cn/m1/3128855-0-default/emp/list").then(result => {
        console.log(result.data)
    });
    axios.post("https://mock.apifox.cn/m1/3128855-0-default/emp/deleteById","id=1").then(result => {
        console.log(result.data)
    });
-->
<body>
    <input type="button" value="获取数据GET" onclick="get()">

    <input type="button" value="删除数据POST" onclick="post()">
</body>
<script>
    function get(){
        /* axios({
            method:"get",
            url:"https://mock.apifox.cn/m1/3128855-0-default/emp/list",
        }).then(result => {
            console.log(result.data)
        }) */
        axios.get("https://mock.apifox.cn/m1/3128855-0-default/emp/list").then(result => {
            console.log(result.data)
        });
    }

    function post(){
        /* axios({
            method:"post",
            url:"https://mock.apifox.cn/m1/3128855-0-default/emp/deleteById",
            data:"id=1"    请求参数
        }).then(result => {
            console.log(result.data)
        }) */
        axios.post("https://mock.apifox.cn/m1/3128855-0-default/emp/deleteById","id=1").then(result => {
            console.log(result.data)
        });
    }
</script>
</html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2050030.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

PROLOG实现亲属关系小型演绎数据库

问题 试编写一个描述亲属关系的PROLOG程序&#xff0c;然后给出一些事实数据&#xff0c;建立一个小型演绎数据库。 代码实现 % 基本事实 father(john, mike). father(john, lisa). father(boluo, ana). father(boluo, peter).mother(mary, mike). mother(mary, lisa). mother…

大厂进阶五:React源码解析之深度剖析Diff算法

本文主要针对React源码进行解析&#xff0c;内容有&#xff1a; 1、Diff算法原理、两次遍历 2、Diff瓶颈及限制 3、Diff更新之单节点和多节点原理 一、Diff源码解析 以下是关于 React Diff 算法的详细解析及实例&#xff1a; 1、React Diff 算法的基本概念和重要性 1.1 概念…

【串口助手开发】--温度曲线图实时显示功能,全流程小白教程,zedgraph控件的使用方法,Visual Studio 软件C#语言

1、ZedGraph.dll 控件下载 链接&#xff1a;下载ZedGraph&#xff08;ZedGraph.dll 和ZedGraph.Web.dll文件&#xff09; 打开链接后&#xff0c;图中红框显示的是仅下载zedgraph控件&#xff0c;本文所需的文件是ZedGraph.dll。 2、ZedGraph.dll 控件添加进Visual Studio 软…

【Arduino】ATmega328PB 连接 LSM6DS3 姿态传感器,并读数据(不确定 ESP 系列是否可行,但大概率是可行的)

总览 1.初始化 ATmega328PB&#xff0c;默认大家已经完成了 328 的配置准备工作&#xff0c;已经直接能够向里面写入程序 2.接线&#xff0c;然后验证 mega328 的 I2C 设备接口能否扫描到 LSM6DS3 3.编写代码&#xff0c;上传&#xff0c;查看串口数据。完成。 一、初始化 AT…

履带无人车+无人机+自组网:空地一体化技术详解

履带无人车、无人机与自组网技术的结合&#xff0c;构成了空地一体化技术的核心框架&#xff0c;这种技术在多个领域展现出巨大的潜力和应用价值。以下是对该技术的详细解析&#xff1a; 一、技术概述 空地一体化技术巧妙融合了履带无人车、无人机以及自组网技术&#xff0c;…

EPIC Institute of Technology Round August 2024 (Div. 1 + Div. 2)

前言 又是一场压线不掉分的比赛。 Standings&#xff1a;2706 题目链接&#xff1a;Dashboard - EPIC Institute of Technology Round August 2024 (Div. 1 Div. 2) - Codeforces A. Distanced Coloring 题意&#xff1a; 给一个 n * m 的矩阵&#xff0c;涂色&#xff0c;要…

pkg 打包后运行报错 Cannot mkdir in a snapshot. Try mountpoints instead.

把项目中使用到的 __dirname 类似这样的 join(__dirname, ./config)替换为 process.cwd() __dirname&#xff1a;获取的是当前文件目录路径&#xff0c;二进制文件内部的文件(pkg打包的二进制文件是快照文件&#xff0c;里面的文件只能读不能修改新增)&#xff0c;比如&#x…

区块链基础

1、区块链定义 区块链技术本质上是一个去中心化的数据库&#xff0c;它是比特币的核心技术与基础架构&#xff0c;是分布式数据存储、点对点传输、共识机制、加密算法等计算机技术的新型应用模式。狭义来讲&#xff0c;区块链是一种按照时间顺序将数据区块以顺序相连的方式组合…

XSS-跨站脚本攻击

目录 XSS简介 XSS分类 反射型XSS&#xff08;非持久型XSS&#xff09; 存储型XSS&#xff08;持久型XSS&#xff09; DOM型XSS HTML文档解析过程 例题 HTML解析 字符实体(character entities) HTML字符实体(HTML character entities) 字符引用&#xff08;character…

程序员如何写PLC程序

PLC是可编程逻辑控制器的简称&#xff0c;常用的编程语言是IEC61131-3&#xff08;梯形图、结构化文本、指令表、功能块、顺序功能图&#xff09;和西门子的SCL。程序员常用的编程语言是JS、Java、Python、C/C、Go等。PLC广泛采用编程工具有codesys、博图等。程序员常用的编程工…

用Python实现9大回归算法详解——06. K近邻回归算法

1. K近邻回归的基本概念 K近邻回归&#xff08;K-Nearest Neighbors Regression, KNN Regression&#xff09;是一种基于实例的学习方法。与传统的回归模型不同&#xff0c;KNN回归不通过显式的函数来建模数据之间的关系&#xff0c;而是通过查找输入样本的“邻居”来进行预测…

【PDF技巧】如何编辑忘记密码PDF文件?

PDF文件打开之后&#xff0c;发现编辑功能都是灰色的&#xff0c;无法使用&#xff0c;无法编辑PDF文件&#xff0c;遇到这种情况&#xff0c;因为PDF文件设置了限制编辑导致的。一般情况下&#xff0c;我们只需要输入PDF密码&#xff0c;将限制编辑取消就可以正常编辑文件了&a…

在线装修管理系统pf

TOC springboot389在线装修管理系统pf 第1章 绪论 1.1 课题背景 互联网发展至今&#xff0c;无论是其理论还是技术都已经成熟&#xff0c;而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播&#xff0c;搭配信息管理工具可以很好地为人们提供服务。所以各行业…

C语言 | Leetcode C语言题解之第345题反转字符串中的元音字母

题目&#xff1a; 题解&#xff1a; char vowel[] "aeiouAEIOU";bool isVowel(char ch) {for (int i 0; vowel[i]; i) {if (vowel[i] ch) {return true;}}return false; };char* reverseVowels(char* s) {int n strlen(s);int i 0, j n - 1;while (i < j) …

C语言三目运算符深度解析

[大师C语言]合集&#xff3b;大师C语言(第一篇)&#xff3d;C语言栈溢出背后的秘密&#xff3b;大师C语言(第二十五篇)&#xff3d;C语言字符串探秘&#xff3b;大师C语言(第二篇)&#xff3d;C语言main函数背后的秘密&#xff3b;大师C语言(第二十六篇)&#xff3d;C语言结构体…

08 STM32 DMA

DMA 协助CPU&#xff0c;完成数据转运工作。 两个程序&#xff1a; DMA数据转运&#xff0c;DMAAD多通道 DMA数据转运&#xff0c;将使用DMA&#xff0c;进行存储器到存储器的数据转运&#xff0c;也就是把一个数组里面的数据&#xff0c;复制到另一个数组里。 定义一个数组D…

3:html(CSS):基础语法3

3.1网页布局与id 3.1.1网页布局 在这里将使用<div>分成一个一个的块&#xff0c;然后进行CSS的美化。这里要说一下html是一个前端的代码&#xff0c;但是它写出来的东西单调缺少美感&#xff0c;CSS就是进行美化的&#xff0c;这里我们使用类的概念来美化我们的网站。 …

apt E: 无法定位软件包 winehq-stable

执行了 添加wine源 wget -NP /etc/apt/sources.list.d/ https://dl.winehq.org/wine-builds/ubuntu/dists/jammy/winehq-jammy.sources还需要执行 更新源 apt update

【观察】星河AI网络:构筑AI时代高质量网络底座,撑起新质生产力发展的浩瀚星空...

知名科技杂志《连线》创始主编凯文凯利曾预测&#xff1a;“在未来的 100 年里&#xff0c;人工智能将超越任何一种人工力量&#xff0c;将人类引领到一个前所未有的时代。” 确实如此&#xff0c;犹如历史上蒸汽机、电力、计算机和互联网等通用技术一样&#xff0c;近20年来&a…