vue 前端项目调用后端接口记录

news2024/12/27 13:42:37

axios中不同的类型的请求附带数据使用的关键字

请求类型关键字示例
GETparamsaxios({ method: 'get', url: 'example.com', params: { key: value } })
POSTdataaxios({ method: 'post', url: 'example.com', data: { key: value } })
PUTdataaxios({ method: 'put', url: 'example.com', data: { key: value } })
PATCHdataaxios({ method: 'patch', url: 'example.com', data: { key: value } })
DELETEdataaxios({ method: 'delete', url: 'example.com', data: { key: value } })
单引号 (') 和双引号 (") 与反引号 (``)(模板字符串)

  • 一段相同的代码,但上面亮,下面不亮。乍一看好像没啥问题,但细心的小伙伴能发现一个是’’ 一个是``
  • 使用单引号和双引号中的东西叫做字符串
  • 似乎用反引号的叫做模板字符串

 区别

特性单引号 (') 或 双引号 (")反引号 (``)
多行字符串不支持,需要使用转义字符 \n支持,可以自然换行
插值不支持支持 ${} 语法嵌入表达式
转义字符需要转义与外部引号相同的字符不需要对 ${} 进行转义
保留空格和换行符
使用场景普通字符串定义,单行字符串多行字符串,字符串插值,保持字符串格式

get 使用 params 来传递数据,而 post 才使用 data 来传递数据

methods: {
  // get 方法
  getBooksList() {
    axios({
      method: 'get',
      url: 'http://hmajax.itheima.net/api/books',
      params: {
        creator: 'Qiuner'
      }
    }).then(result => {
      let bookList = result.data
    })
  }
  // post 方法
  getBooksList() {
    axios({
      method: 'post',
      url: 'http://hmajax.itheima.net/api/books',
      data: {
        creator: 'Qiuner'
      }
    }).then(result => {
      let bookList = result.data
    })
  }
}
冷知识(对于我来说)
<div>
  <label for="bg">更换背景</label>
  <input type="file" id="bg">
</div>
  • 这里代码使用了label,当for与id相同时,点击这个label就等于点击input了。而这个input被用来上传文件
  • 但实际定位还是要定位到input上的

参考原文链接:两年经验前端带你重学前端框架必会的ajax+node.js+webpack+git等技术 Day2-CSDN博客 

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

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

相关文章

快速读出linux 内核中全局变量

查问题时发现全局变量能读出来会提高效率&#xff0c;于是考虑从怎么读出内核态的全局变量&#xff0c;脚本如下 f open("/proc/kcore", rb) f.seek(4) # skip magic assert f.read(1) b\x02 # 64 位def read_number(bytes):return int.from_bytes(bytes, little,…

深度解读李彦宏的“不要卷模型,要卷应用”

深度解读李彦宏的“不要卷模型&#xff0c;要卷应用” —— AI技术的应用之道 引言 在2024世界人工智能大会的舞台上&#xff0c;李彦宏的“不要卷模型&#xff0c;要卷应用”言论犹如一石激起千层浪&#xff0c;引发了业界对AI技术发展路径的深思。本文将深入探讨这一观点&a…

修改vscode的字体为等宽字符

在文件——首选项——设置 中 搜索 Editor: Font Family 将内容改为下面的 Consolas, Courier New, monospace 之后重启Vscode就行了

vs2017/2019串口Qt Serial Port/modbus使用报错

vs2017/2019 Qt Serial Port/modbus配置 /* * 严重性 代码 说明 项目 文件 行 禁止显示状态 错误 LNK2019 无法解析的外部符号 "__declspec(dllimport) public: __cdecl QModbusTcpClient::QModbusTcpClient(class QObject *)" (__imp_??…

【代码随想录】【算法训练营】【第66天】 [卡码95]城市间货物运输II [卡码96]城市间货物运输III

前言 思路及算法思维&#xff0c;指路 代码随想录。 题目来自 卡码网。 day 66&#xff0c;周五&#xff0c;ding ding~ [卡码95] 城市间货物运输II 题目描述 卡码95 城市间货物运输II 解题思路 前提&#xff1a; 思路&#xff1a; 重点&#xff1a; 代码实现 C语言 …

智慧养殖的智慧网络:构建高效、可扩展的养殖生态

智慧养殖&#xff0c;在国家政策的大力扶持和农业数字化浪潮的推动下&#xff0c;正迅速发展。然而&#xff0c;许多人对它的价值仍持怀疑态度&#xff1a;认为智慧养殖只是昂贵的技术堆砌&#xff0c;短期内看不到经济回报&#xff0c;甚至怀疑其实用性。本文将挑战这些观点&a…

百川工作手机监控企业员工微信行为

在数字化转型的浪潮中&#xff0c;企业沟通方式正经历着前所未有的变革。微信&#xff0c;作为日常交流不可或缺的工具&#xff0c;已成为企业内外协作的重要桥梁。然而&#xff0c;随着业务量的激增&#xff0c;如何有效监控与管理员工在微信上的行为&#xff0c;确保信息安全…

LLM推理优化笔记1:KV cache、Grouped-query attention等

KV cache 对于decoder-only 模型比如现在如火如荼的大模型&#xff0c;其在生成内容的过程中&#xff0c;为了避免冗余计算&#xff0c;会将Transformer里的self-attention的K和V矩阵给缓存起来&#xff0c;这个过程即为KV cache。 decoder-only模型的生成过程是自回归的&…

让人工智能为你的旋律填词,开启音乐新章

在音乐的世界里&#xff0c;旋律如同灵动的精灵&#xff0c;飞舞在我们的心间。但有时&#xff0c;为这美妙的旋律找到最贴切、最动人的歌词&#xff0c;却成为了创作者们的难题。如今&#xff0c;随着科技的进步&#xff0c;人工智能正逐渐成为我们在音乐创作道路上的得力助手…

【香橙派 Orange pi AIpro】| 开发板深入使用体验

目录 一. &#x1f981; 写在前面二. &#x1f981; 愉快的安装流程2.1 安装前准备2.2 流程准备2.2.1 烧录镜像2.2.2 开机2.2.3 连网2.2.4 SSH远程连接开发板 2.3 体验 AI 应用样例 三. &#x1f981; 写在最后 一. &#x1f981; 写在前面 大家好&#xff0c;我是狮子呀&…

Windows下vscode配置C++环境

一、vscode下载及安装 vscode官网 选安装位置。 勾选这几项。 1.vscode界面中文配置 &#xff08;1&#xff09;点击扩展小图标&#xff0c;搜索插件&#xff0c;找到插件Chinese (Simplified) (简体中文) Language Pack&#xff0c;点击install。 &#xff08;2&#xf…

3dmax-vray5大常用材质设置方法

3dmax云渲染平台——渲染100 以高性价比著称&#xff0c;是预算有限的小伙伴首选。 15分钟0.2,60分钟内0.8;注册填邀请码【7788】可领30元礼包和免费渲染券 提供了多种机器配置选择(可以自行匹配环境)最高256G大内存机器&#xff0c;满足不同用户需求。 木纹材质 肌理调整&…

红酒的艺术之旅:品味、鉴赏与生活的整合

在繁忙的都市生活中&#xff0c;红酒如同一道不同的风景线&#xff0c;将品味、鉴赏与日常生活巧妙地整合在一起。它不仅仅是一种饮品&#xff0c;更是一种艺术&#xff0c;一种生活的态度。今天&#xff0c;就让我们一起踏上这趟红酒的艺术之旅&#xff0c;探寻雷盛红酒如何以…

json-server服务使用教程

目录标题 安装 json-server启动 json-server 本地服务 安装 json-server npm install -g json-server0.17.4json-server -v报错请参考&#xff1a;执行json-server -v报错 因为在此系统上禁止运行脚本。 启动 json-server 本地服务 查看本机IP&#xff1a;ipconfig Shift右…

【简历】安徽某二本学院:Java简历指导,简历通过率接近为0

注&#xff1a;为保证用户信息安全&#xff0c;姓名和学校等信息已经进行同层次变更&#xff0c;内容部分细节也进行了部分隐藏 简历说明 这是一份二本独立院校的Java简历&#xff0c;那么一般来说&#xff0c;我们的独立院校包括专升本&#xff0c;在目前的it的投递中&#x…

NI VST 毫米波测试仪器创新

目录 概览​从UHF至V频段的频率覆盖范围&#xff1a;54 GHz远程测量模块​PXIe-5842&#xff1a;VST架构的扩展54 GHz扩频PXIe-5842功能​​宽频覆盖范围​IF和毫米波测试端口可满足多频带需求​高达2 GHz瞬时带宽误差矢量幅度测量性能相位相干同步基于PXI平台集成多种仪器 互补…

在centos7.9下静默安装Oracle19c详细流程

文章目录 下载安装包1.下载Oracle19c的安装包2.下载Oracle19c的预安装包3.拖到Linux中 一、安装依赖二、创建用户和组三、修改Linux相关内核参数四、修改用户限制五、关闭防火墙和SELinux六、创建安装目录并解压安装包七、设置环境变量八、安装Oracle数据库九、创建实例十、配置…

智慧校园毕业管理:全面解读毕业批次功能

在智慧校园的毕业管理系统中&#xff0c;毕业批次模块通过其精心设计的毕业批次功能&#xff0c;为即将离校的学子们提供了一个高效、便捷的过渡平台。这一特色功能聚焦于特定时间段内的毕业生群体&#xff0c;巧妙融合数字技术&#xff0c;从信息核实到最终的离校程序&#xf…

Leetcode3200. 三角形的最大高度

Every day a Leetcode 题目来源&#xff1a;3200. 三角形的最大高度 解法1&#xff1a;模拟 枚举第一行是红色还是蓝色&#xff0c;再按题意模拟即可。 代码&#xff1a; /** lc appleetcode.cn id3200 langcpp** [3200] 三角形的最大高度*/// lc codestart class Solutio…

5.1 软件工程基础知识-软件工程概述

软件工程诞生原因 软件工程基本原理&#xff08;容易被考到&#xff09; 软件生存周期 能力成熟度模型 - CMM 能力成熟度模型 - CMMI 真题