vue框架中的axios

简介: Axios 是一个基于 promise 网络请求库,作用于node.js 和浏览器中。 它是 isomorphic 的(即同一套代码可以运行在浏览器和node.js中)。

首先明白axios是什么?


官方文档给出的解释是:Axios 是一个基于 promise 网络请求库,作用于node.js 和浏览器中。 它是 isomorphic 的(即同一套代码可以运行在浏览器和node.js中)。


其实axios在vue项目中就是请求服务器端接口数据,得到数据后在回调中对数据进行操作。


axios分为get请求和post请求:


1.get请求:get请求的时候参数通过params进行传递

5e7299c674164dcea7f52a9d91b435f8.png

2.post请求:post请求使用data传参,需要使用qs处理参数

08c645235dbf43a8a51e93cc9261aea9.png

配置qs


qs是axios的一个数据序列化工具,可通过npm install qs命令进行安装.然后在需要使用的页面引用


import axios from 'axios'


import qs from 'qs'


方法 qs.parse()、qs.stringify()


qs.stringify()将对象序列化成URL的形式,以&进行拼接


qs.parse()将URL解析成对象的形式


目录
相关文章
|
6月前
|
JavaScript
Vue中Axios网络请求封装-企业最常用封装模式
本教程介绍如何安装并配置 Axios 实例,包含请求与响应拦截器,实现自动携带 Token、错误提示及登录状态管理,适用于 Vue 项目。
259 1
|
JavaScript 容器
乾坤qiankun框架搭建 主应用为vue3的项目。
乾坤qiankun框架搭建 主应用为vue3的项目。
974 2
|
9月前
|
JavaScript API 开发者
Vue框架中常见指令的应用概述。
通过以上的详细解析,你应该已经初窥Vue.js的指令的威力了。它们是Vue声明式编程模型的核心之一,无论是构建简单的静态网站还是复杂的单页面应用,你都会经常用到。记住,尽管Vue提供了大量预定义的指令,你还可以创建自定义指令以满足特定的需求。为你的Vue应用程序加上这些功能增强器,让编码变得更轻松、更愉快吧!
178 1
|
10月前
|
人工智能 自然语言处理 JavaScript
用 CodeBuddy 搭建Vue框架 像呼吸一样简单
本文介绍如何借助 CodeBuddy 快速创建 Vue 项目。CodeBuddy 是一款支持自然语言编程的工具,能根据用户需求自动生成代码,降低开发门槛。文章详细说明了通过 CodeBuddy 创建 Vue 项目的步骤,包括解决项目创建失败的问题、自动补全代码功能以及启动开发服务器的方法。无论开发者经验如何,CodeBuddy 都能显著提升效率,让开发更专注创意实现。
|
JavaScript 前端开发 API
|
缓存 JavaScript 搜索推荐
|
前端开发 JavaScript 开发者
|
JavaScript 前端开发 API
Vue.js:现代前端开发的强大框架
【10月更文挑战第11天】Vue.js:现代前端开发的强大框架
487 41
|
数据可视化 前端开发 JavaScript
GoView:Start14.6k,上车啦上车啦,Vue3低代码平台GoView,零代码+全栈框架
GoView 是一个Vue3搭建的低代码数据可视化开发平台,将图表或页面元素封装为基础组件,无需编写代码即可完成业务需求。 它的技术栈为:Vue3 + TypeScript4 + Vite2 + NaiveUI + ECharts5 +VChart + Axios + Pinia2 + PlopJS
329 0
|
缓存 监控 JavaScript
Vue.js 框架下的性能优化策略与实践
Vue.js 框架下的性能优化策略与实践