【javascript基础——系列2】前端页面axios连接后台服务器传输数据
前端页面axios连接后台服务器传输数据前言一、axios二、使用步骤三、相关配置前言axios 是由 promise 封装的一个 http 的库。提示:以下是本篇文章正文内容,下面案例可供参考一、axiosaxios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,本质上也是对原生XHR的封装,只不过它是Promise的实现版本,符合最新的ES规范,它本身具有以下特征
系列文章
【javascript基础——系列1】前端页面ajax连接后台服务器传输数据
【javascript基础——系列2】前端页面axios连接后台服务器传输数据
【javascript基础——系列3】js中的事件的事件冒泡、事件捕获
【javascript基础——系列4】关于js的数据类型以及判别方法
【javascript基础——系列5】js的defer和async;parsesint;图片压缩
【javascript基础——系列6】常见的5种JS设计模式;发布订阅者模式
【javascript基础——系列7】变量提升函数提升;内存泄漏
【javascript基础——系列8】函数传参传递值还是引用;函数式编程
【javascript基础——系列10】js中隐藏元素的几种方法以及代码
【javascript基础——系列11】跨域存在的原因以及解决办法
前言
axios 是由 promise 封装的一个 http 的库。
提示:以下是本篇文章正文内容,下面案例可供参考
一、axios
axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,本质上也是对原生XHR的封装,只不过它是Promise的实现版本,符合最新的ES规范,它本身具有以下特征:
• 从浏览器中创建 XMLHttpRequest
• 支持 Promise API
• 客户端支持防止CSRF
• 提供了一些并发请求的接口(重要,方便了很多的操作)
• 从 node.js 创建 http 请求
• 拦截请求和响应
• 转换请求和响应数据
• 取消请求
• 自动转换JSON数据
二、使用步骤
http://localhost:5000/data
代表服务端地址,then( response
的response代表收到的数据;.catch(function (error)
表示捕捉到的错误。
代码如下(示例):
this.$axios.post('http://localhost:5000/data', {
firstName: 'Fred',
lastName: 'Flintstone'
})
.then( response => {
console.log('dataaaa',response);
this.details=[
{content:'(1) 01:33||02:42||04:13处出现闪烁缺陷'},
{content:'(2) 全片共出现三次闪烁缺陷'},
{content:'(3) 01:33处闪烁缺陷高于正常值20%'},
{content:'(4) 02:42处闪烁缺陷高于正常值30%'},
{content:'(5) 04:13处闪烁缺陷低于正常值10%'}
]
})
.catch(function (error) {
console.log(error);
})
三、相关配置
代码如下(示例):
配置
在src/main.js配置 axios,加入如下两行代码:
import axios from 'axios'
Vue.prototype.$axios= axios
ajax的文章链接:https://blog.csdn.net/yangyaning123/article/details/117198344?spm=1001.2014.3001.5502
码字不易~, 各位看官要是看爽了,可不可以三连走一波,点赞皆有好运!,不点赞也有哈哈哈~~~
更多推荐
所有评论(0)