vue快速入门(二十七)axios库的下载与使用

embedded/2024/11/27 19:50:53/

注释很详细,直接上代码

上一篇

新增内容

  1. axios.js文件的下载与导入
  2. axios请求的使用与解析赋值

官网不科学上网太慢,csdn资源审核太慢,so我传自己主机了(访问不了@我)
axios.js文件
自己下载一下吧
在这里插入图片描述

源码

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>Document</title></head><body><!-- 挂载点 --><div id="root"><img v-for="(item,index) in lists" :key="index" :src="item" style="height: 300px; width: auto;border-radius: 10px;margin: 5px;"/></div><!-- 导入vue的js代码:不会下载的看专栏第一篇 --><script src="./lib/vue2.js"></script><!-- 导入axios的js代码 --><script src="./lib/axios.js"></script><script>javascript">const app = new Vue({// Vue实例el: "#root", // 挂载点data: {// 数据lists:null},async created() {// 创建完成//发网络请求const res = await axios.get("https://api.unmz.net/free/api/images/girl/getRandomGirlUrl");this.lists = res.data.data;},methods: {// 方法},computed: {// 计算属性},watch: {// 侦听器},});</script></body>
</html>

效果演示(用了个大家爱看的接口)

在这里插入图片描述


http://www.ppmy.cn/embedded/5294.html

相关文章

HCIP-OSPF综合实验

一实验拓扑图 二.实验要求 1、R4为ISP&#xff0c;其上只配置IP地址&#xff1b;R4与其他所直连设备间均使用公有IP&#xff1b; 2、R3-R5、R6、R7为MGRE环境&#xff0c;R3为中心站点&#xff1b; 3、整个OSPF环境IP基于172.16.0.0/16划分&#xff1b;除了R12有两个环回&…

计算机网络之同轴电缆,集线器,网桥,交换机,路由器

ping的过程 两台主机用交叉线连接&#xff0c;通过88.2ping88.3发现底层是先经过广播&#xff0c;通过arp协议&#xff0c;告诉我要找的ip是88.3,然后88.3主机收到后就把自己的mac地址发送回去&#xff0c;同理88.2发现是发给自己的后就进行接收&#xff0c;有了mac地址然后再通…

NLP预训练模型- GPT-3学习指南与学习总结案例

NLP预训练模型GPT-3学习指南与学习案例 学习指南 GPT-3&#xff0c;作为OpenAI开发的一种先进的语言生成模型&#xff0c;具有强大的语言理解和生成能力。为了有效地学习和应用GPT-3&#xff0c;以下是一些建议的学习指南&#xff1a; 理解模型原理&#xff1a;首先&#xf…

Proxyman Premium for Mac v5.1.1激活版:卓越的网络调试与分析工具

Proxyman Premium for Mac是一款功能强大的网络调试与分析工具&#xff0c;专为开发人员和测试人员精心打造。它集多种功能于一身&#xff0c;为用户提供了全面、高效的网络开发体验。 Proxyman Premium for Mac v5.1.1激活版下载 作为一款跨平台代理工具&#xff0c;Proxyman …

Docker in Docker (DinD): 深入探索与实际应用

引言 在软件开发的多样化环境中&#xff0c;Docker已成为一种重要的工具&#xff0c;用于实现应用的快速部署和可靠性。Docker in Docker&#xff08;DinD&#xff09;进一步推进了这一概念&#xff0c;使开发者能在一个Docker容器中运行另一个Docker实例。本文将详细探讨DinD…

Jmeter BeanShell调用Java方法加密

1、添加BeanShell前置处理器 由于请求接口时&#xff0c;会传加密参数。加密过程会在请求之前完成&#xff0c;所以需要使用前置处理器中beanshell preprocessor 2、编写BeanShell脚本 ①定义一个beashell变量&#xff1a;phoneNum&#xff0c;在Beanshell中可以直接调用Jmete…

【系统架构师】-案例考点(一)

1、软件架构设计 主要考点&#xff1a; 质量属性、软件架构风格、软件架构评估、MVC架构、面向服务的SOA架构、 DSSA、ABSD 1.1、质量属性 1、性能:指系统的响应能力&#xff0c;即要经过多长时间才能对某个事件做出响应&#xff0c;或者在某段时间内系统所能处理的事件的…

一文读懂uniapp中的tabBar底部导航

目录 1. 基本知识2. Demo 1. 基本知识 UniApp 中的 tabBar 是用来在应用程序底部显示可切换的选项卡的组件&#xff0c;通常用于实现底部导航栏 允许用户通过点击不同的选项卡来切换应用程序的不同页面或功能模块 其代码如下&#xff1a; "tabBar":{"color&q…