首页 web前端 js教程 关于vue.js简单配置axios的方法介绍

关于vue.js简单配置axios的方法介绍

Jun 29, 2018 am 11:54 AM
axios vue.js vuejs

这篇文章主要介绍了关于vue.js简单配置axios的方法介绍,有着一定的参考价值,现在分享给大家,有需要的朋友可以参考一下

axios是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,下面这篇文章主要给大家介绍了关于vue.js简单配置axios的相关资料,需要的朋友们可以参考借鉴,需要的朋友们下面来一起学习学习吧。

前言

官方现在已经不再推荐用resource了,换了个axios,咱也不能落后,至少你得知道咋弄,面试的时候也好给面试官吹吹牛逼,废话不多说。

它本身具有以下特征:

  • 从浏览器中创建 XMLHttpRequest

  • 从 node.js 发出 http 请求

  • 支持 Promise API

  • 拦截请求和响应

  • 转换请求和响应数据

  • 取消请求

  • 自动转换JSON数据

  • 客户端支持防止 CSRF/XSRF

配置方法

首先用npm安装

npm install --save axios vue-axios
登录后复制

安装完之后,在你的main.js文件里配置,加上这两句就好

import axios from 'axios'
Vue.prototype.$http = axios
登录后复制

然后你读取接口数据的时候,直接就可以这样写,这个跟resource一个样,我那个下面的op,uin之类的都是要传的参数。

this.$http.post(localStorage.getItem("addUrl")+'/skynet_sync/btsp', {
       "op": "update_card_num",
       "uin": uin,
       "protypeId": index,   
       "cardNumber": parseInt(v)
      })
      .then(response=> {
      //如果接口走成功就执行这里
      }).catch(function (error) {
      //接口失败,也就是state不是200的时候,走这里
      });
登录后复制

好了,搞定!

以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP中文网!

相关推荐:

如何利用Vue.js指令实现全选功能

关于vue路由的使用解析

以上是关于vue.js简单配置axios的方法介绍的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

<🎜>:泡泡胶模拟器无穷大 - 如何获取和使用皇家钥匙
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora:巫婆树的耳语 - 如何解锁抓钩
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
北端:融合系统,解释
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1667
14
CakePHP 教程
1426
52
Laravel 教程
1328
25
PHP教程
1273
29
C# 教程
1255
24
如何使用Vue实现仿QQ聊天气泡特效 如何使用Vue实现仿QQ聊天气泡特效 Sep 20, 2023 pm 02:27 PM

如何使用Vue实现仿QQ聊天气泡特效在现如今的社交时代,聊天功能已经成为了手机应用和网页应用的核心功能之一。而聊天界面中最常见的元素之一就是聊天气泡,它可以清晰地将发送者和接收者的信息区分开来,有效地提高了信息的可读性。本文将介绍如何使用Vue实现仿QQ聊天气泡特效,以及提供具体的代码示例。首先,我们需要创建一个Vue组件来表示聊天气泡。组件包含两个主要部分

Vue.js与Lua语言的融合,构建游戏开发的前端引擎的最佳实践和经验分享 Vue.js与Lua语言的融合,构建游戏开发的前端引擎的最佳实践和经验分享 Aug 01, 2023 pm 08:14 PM

Vue.js与Lua语言的融合,构建游戏开发的前端引擎的最佳实践和经验分享引言:随着游戏开发的不断发展,游戏前端引擎的选择成为了一个重要的决策。在这些选择中,Vue.js框架和Lua语言都成为了众多开发者的关注点。Vue.js作为一款流行的前端框架具有丰富的生态系统和便捷的开发方式,而Lua语言则因其轻量级和高效性能在游戏开发中得到广泛应用。本文将探讨如何将

如何使用PHP和Vue.js实现图表上的数据筛选和排序功能 如何使用PHP和Vue.js实现图表上的数据筛选和排序功能 Aug 27, 2023 am 11:51 AM

如何使用PHP和Vue.js实现图表上的数据筛选和排序功能在网页开发中,图表是一种非常常见的数据展示方式。使用PHP和Vue.js可以轻松实现图表上的数据筛选和排序功能,使用户能够自定义查看图表上的数据,提高数据的可视化效果和用户体验。首先,我们需要准备一组数据供图表使用。假设我们有一个数据表格,包含姓名、年龄和成绩三列,数据如下:姓名年龄成绩张三1890李

Vue.js与Dart语言的集成,构建酷炫的移动应用UI界面的实践和开发技巧 Vue.js与Dart语言的集成,构建酷炫的移动应用UI界面的实践和开发技巧 Aug 02, 2023 pm 03:33 PM

Vue.js与Dart语言的集成,构建酷炫的移动应用UI界面的实践和开发技巧引言:在移动应用开发中,用户界面(UI)的设计和实现是非常重要的一部分。为了能够实现酷炫的移动应用界面,我们可以将Vue.js与Dart语言进行集成,借助Vue.js的强大数据绑定和组件化特性,以及Dart语言的丰富的移动应用开发库,来构建出令人惊艳的移动应用UI界面。本文将介绍如何

如何在PHP和Vue.js中实现可交互的热力图统计 如何在PHP和Vue.js中实现可交互的热力图统计 Aug 19, 2023 am 09:41 AM

如何在PHP和Vue.js中实现可交互的热力图统计热力图(Heatmap)是一种以热力图的形式展示数据分布和集中度的可视化方式。在Web开发中,常常需要将后端数据和前端展示结合起来,实现可交互的热力图统计功能。本文将介绍如何在PHP和Vue.js中实现这一功能,并提供相应的代码示例。第一步:后端数据的准备首先,我们需要准备用于生成热力图的数据。在PHP中,我

vue.js vs.反应:特定于项目的考虑因素 vue.js vs.反应:特定于项目的考虑因素 Apr 09, 2025 am 12:01 AM

Vue.js适合中小型项目和快速迭代,React适用于大型复杂应用。1)Vue.js易于上手,适用于团队经验不足或项目规模较小的情况。2)React的生态系统更丰富,适合有高性能需求和复杂功能需求的项目。

Vue.js很难学习吗? Vue.js很难学习吗? Apr 04, 2025 am 12:02 AM

Vue.js不难学,特别是对于有JavaScript基础的开发者。1)其渐进式设计和响应式系统简化了开发过程。2)组件化开发让代码管理更高效。3)使用示例展示了基本和高级用法。4)常见错误可以通过VueDevtools调试。5)性能优化和最佳实践如使用v-if/v-show和key属性可提升应用效率。

Vue.js与Shell脚本的集成,实现自动化工作流程 Vue.js与Shell脚本的集成,实现自动化工作流程 Aug 02, 2023 pm 12:28 PM

Vue.js与Shell脚本的集成,实现自动化工作流程概述:在软件开发过程中,自动化工作流程可以极大地提高开发效率和质量。Vue.js是一款流行的前端框架,而Shell脚本是一种执行命令行任务的工具。本文将介绍如何将Vue.js与Shell脚本集成,实现自动化工作流程,为开发者提供更便捷的开发体验。背景:Vue.js是一款使用JavaScript进行开发的前

See all articles