-
常用参数配置
根据使用场景去用不同的参数配置方式：当请求域是不同的时候，并且会有很多都用到这个请求域时，可以以局部配置参数形式。如果就一个地方使用这个请求域，那么就可以通过发送请求时配置。
查看全部 -
axios基本配置参数
参数1、baseURL：请求域名，或者是基本地址（默认配置http://localhost:8080，就像通过axios的get('/data.json'）访问时，前面添加了默认的域名。
参数2、timeout：超时时长，默认1000毫秒（超时时长作用：一般它由后端定义，例如：请求一个接口，接口的数据量比较大，需要处理时间比较长，如果超过了这个时间，后端就会返回401，这样做的好处是，一旦请求时间较长，使这个请求不会阻塞后端的内容，减少服务器的压力，它就会及时释放超时的这些内容，超时时长不止后端需要设置，前端也需要设置一下，当超时时，请求就取消了）。
参数3、url：请求路径。
参数4、method：请求方法。
参数5、headers：请求头，可以在请求头里添加一些参数（比如登录时可能需要从请求头里获取token，去鉴权获取登录人信息，此时就需要在这里配置）。
参数6、params{}：请求参数放置在请求头中。
参数7、data：{}请求参数放置在请球体中。
axios定义配置参数的位置
1、axios全局配置（相当于在import的axios的vue页面中对所有创建的axios进行全局配置）
axios.defaults：表示指向axios库的默认配置，defaults后面就可以.出来配置参数。
axios.defaults.timeout=2000,此时就表示全局配置。
axios.defaults.baseURL='http://localhost:8080'。
2、axios实例配置（相当于局部的）
let instance=axios.create()，如果不传配置参数，如果定义了全局，就是用全局，否则使用默认的。
instance.defaults.timeout=3000，这种方式是创建完实例之后去设置参数。
3、axios请求配置（发送请求时）
instance.get('/data.json',{
timeout:5000
}）
参数配置优先级：全局<局部<请求。如上，最终timeout为5000。
查看全部 -
创建axios实例
使用场景：当接口地址多个时候（端口号之前的域名可能是多个时候），并且超时时长不一样时。
此时就可以通过axios实例，在axios实例中设置这两种参数，然后通过实例去请求接口。
示例：通过axios的create方法，它的参数就是axios的配置信息。
超时时长：发起http请求时候，如果服务端长时间没有返回数据，那么接口就会报超时401，通常具体超时时长由后端进行定义（如果请求一个比较大的数据，后端需要处理，一旦处理时间过长，例如超过1秒，那么后端就可能会返回401，告诉接口请求超时了）。
参数1：baseURL，表示域名（例如：http://localhost:8080）
参数2：timeout，超时时长（默认1000，1秒，当超过1秒就会报401）
使用方法：
查看全部 -
在vue3.0+项目中安装axios：
npm add axioa
查看全部 -
并发请求：同时发送多个请求，并统一处理返回值。
axios并发请求涉及到两个方法
all（）：参数为一个数组，数组的对象为一个一个的axios请求。
spread（）：它是在请求完成后，对多个请求返回的数据进行分割处理。
axios发送请求和axios并发请求的回调函数使用是不同的，如下图
样例：
查看全部 -
axios请求方法及别名（delete）
当传参时，参数拼接在url后面：
当传参时，参数放置在请求体中：
查看全部 -
axios请求方法和别名（post请求和put请求）
post请求传参的数据格式：
1、form-data（表单提交，文件上传、图片上传）
2、application/json
appcalition/json样例，如图
formdata样例，如图
put请求和patch请求和post请求类似都有form-data和application/json这两种数据内容类型。
查看全部 -
axios请求方法及别名
类别：get、post、put、patch、delete
get请求：第一种相当于别名方式，第二种通过配置方式。
get请求带参数方式
路由引入组件两种方式区别：
第一种无论是否通过路由去访问该组件都会加载该组件。
第二种只有当通过路由去访问该组件时才回去加载该组件（可以理解为懒加载或者异步加载）。
如下图，它是vue的socket通信，表示热更新，也就是代码编辑完成之后，页面会自动更新
Status Code：304，表示重定向，正常访问一个接口时，返回的是200，如果第二次访问接口时，数据没有变化，那么浏览器就会自动识别返回状态304，相当于没有更改，这样加载会更快。
查看全部 -
1、vue命令
vue卸载命令：npm uninstall -g vue-cli（vue-cli 2的卸载命令）
vue版本命令：vue -V
vue安装命令：npm install -g @vue/cli(vue-cli 3的安装命令）
vue创建工程化项目命令：vue create 工程名
vue安装axios命令：npm add axios
2、axios基本使用
查看全部 -
Axios介绍：是一个基于promise的HTTP库（类似于jquery的ajax），用于发送请求。既可以用于浏览器（客户端）也可以用于node.js编写的服务端。
Axios特性：
1、支持Promise API
2、拦截请求和响应（请求前和响应前执行一些操作，比如请求前在请求header中添加一些信息，例如授权信息等）
3、转换请求数据和响应数据（比如请求时候一些比较敏感的信息需要加密，数据回来的时候进行解密）
4、取消请求
5、自动转换JSON数据（相当于自动的调用JSON.parse()）
6、客户端支持防御XSRF攻击
查看全部 -
post方法
form-data 表单提交（图片上传，文件上传）
let data ={
id:12
}
axios.post('/post',data).then(res=>{console.log(res)}//axios.post('/post',{})
方法二
axios（{
method：‘post’,
url:'/post',
data:data}）.then(res=>{
console.log(res)})
查看全部 -
懒加载方法：
{ path:'/2-2', name:'axios'请求方法， component:()=>import('./views/2-2.vue') }查看全部 -
get方法1：
crented(){ axios.get('/data.json',{ params:{id:12} }).then((res) =>{ console.log(res) }) }方法二：
axios({ method:'get',url:'/data.json'}).then(res=>{ console.log(res)})查看全部 -
axios 请求方法：get post put patch delete
get:获取数据post:提交数据（表单提交+文件上传）
put：更新数据（所有数据推送到后端）
patch:更新数据（只将修改的数据推送）
detele:删除数据
查看全部
举报