我们常用的有get方法以及post方法,下面简单的介绍一下这两种请求方法

vue中使用axios方法我们先安装axios这个方法

npm install --save axios

安装之后采用按需引入的方法,哪个页面需要请求数据就在哪个页面里引入一下。

import axios from 'axios'

引入之后我们就可以进行数据请求了,在methods中创建一个方法

1 methods:{
2 getInfo(){
3 let url = "url"
4 axios.get(url).then((res)=>{
5 console.log(res)
6 })
7 }
8 }

然后我们在mounted这个生命周期中进行调用

1 mounted(){
2 this.getInfo()
3 }

这样就可以在控制台中查看数据,以上是一个简单的get方法数据请求,下面继续介绍一下post方法的使用,其实post和get的使用没有什么区别只是再加上一个参数就可以了,看一下我们的代码

 1 methods:{
2 postInfo(){
3 let url = "url"
4 let params=new URLSearchParams();//这个方法在axios的官网中有介绍,除了这个方法还有qs这个方法
5 params.append("key",index)
6 params.append("key",index)
7 axios.post(url,params).then((res)=>{
8 console.log(res)
9 })
10 }
11 }

同样在mounted这个生命周期中进行调用

1 mounted(){
2 this.postInfo()
3 }

vue axios数据请求get、post方法的使用的更多相关文章

  1. vue axios 数据请求实现

    1.安装nginx npm install axios --save-dev cnpm install axios --save-dev 使用淘宝镜像 保存依赖文件到本地 装好了.packjson.j ...

  2. 02 Vue之vue对象属性功能&axios数据请求实现

    1.过滤器的声明和使用 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 1 使用Vue.filter()进行全局定义 2 在v ...

  3. day 74 vue 2 axios数据请求 以及组件的学习

    前情提要:   vue 学习二: 一: 通过axios实现数据请求 1:json数据语法 json数据对象类似于JavaScript中的对象,但是它的键对应的值里面是没有函数方法的,值可以是普通变量, ...

  4. vue 使用axios 数据请求第三方插件的使用

    axios 基于http客户端的promise,面向浏览器和nodejs 特色 浏览器端发起XMLHttpRequests请求 node端发起http请求 支持Promise API 监听请求和返回 ...

  5. 细说vue axios登录请求拦截器

    当我们在做接口请求时,比如判断登录超时时候,通常是接口返回一个特定的错误码,那如果我们每个接口都去判断一个耗时耗力,这个时候我们可以用拦截器去进行统一的http请求拦截. 1.安装配置axios cn ...

  6. 运行命令区分webpack环境,以及axios数据请求的封装

    在开发环境和线上环境时,由于环境的不同,有时候需要修改一定的代码,可以通过配置webpack环境来减少对代码的修改:另外,有时候去看别人的代码,你可能都找不到他的数据请求在什么位置,最近在做一个vue ...

  7. vue axios get请求参数为json对象 而非字符串形式

    axios get请求方式 传递给后台的参数都是字符串下形式,无法传递json对象 或数组对象等    post请求方式则可以实现,   但若后台接口要求必须用get方式传递对象给后台,需要装插件,实 ...

  8. vue axios异步请求django

    1,配置请求路径 (1),vue中的请求路径要与django视图路径相同. (2),vue中的路由路径也要和django视图路径相同,比如视图路径为127.0.0.1:8000:home/index, ...

  9. vue axios post请求下载文件,后台springmvc完整代码

     注意请求时要设置responseType,不加会中文乱码,被这个坑困扰了大半天... axios post请求:     download(index,row){         var ts =  ...

随机推荐

  1. 带你一文了解Python中的运算符

    运算符 目标 算数运算符 比较(关系)运算符 逻辑运算符 赋值运算符 运算符的优先级 数学符号表链接:https://zh.wikipedia.org/wiki/数学符号表 01. 算数运算符 是完成 ...

  2. 浅谈HTTP Keep-Alive

    背景是一次线上故障 项目类型vue ssr 与server的数据交互用的http内网域名方案 在5月发生了一次线上CPU100%的问题,直接导致了NodeServer 500. 最终解决办法是: 1. ...

  3. mysql 开发进阶篇系列 54 权限与安全(账号管理的各种权限操作 下)

    1. 查看权限 -- 如果host值不是%, 就要加上host值,下面查看bkpuser用户权限(6个权限, 限本地连接) SHOW GRANTS FOR bkpuser@localhost; -- ...

  4. Docker中运行nginx并挂载本地目录到镜像中

    1.1 从hup上pull镜像1.2 创建将要挂载的目录1.3 先要有配置文件才能启动容器1.3.1 vim /data/nginx/conf/nginx.conf1.3.2 vim /data/ng ...

  5. 【原创】DMA

    什么是DMA     DMA,Direct Memory Access,直接内存访问,是一种不经过CPU而直接从内存存取数据的数据交换模式.在DMA模式下,CPU只需要向DMA控制器下达指令,传输数据 ...

  6. Linux常用命令之压缩和解压缩命令

    目录 1.压缩解压缩格式 .gz 一.将文件压缩为 .gz 格式,只能压缩文件:gzip 二.将 .gz 文件解压:gunzip 2.压缩解压缩格式 .tar.gz 一.将文件或目录压缩为 .tar. ...

  7. docker使用ssh远程连接容器(没钱买服务器又不想安装虚拟机患者必备)

    突然有需求,需要使用go语言写个ssh终端连接功能,这时候手上又没有服务器,虚拟机也没有,正好使用docker搞起来 docker容器开启sshd服务,模拟服务器 我们知道docker是可以用exec ...

  8. 【WebApi系列】浅谈HTTP在WebApi开发中的运用

    WebApi系列文章 [01]浅谈HTTP在WebApi开发中的运用 [02]聊聊WebApi体系结构 [03]详解WebApi参数的传递 [04]详解WebApi测试和PostMan [05]浅谈W ...

  9. 2017 ACM/ICPC Asia Regional Shenyang Online(部分题解)

    HDU 6197 array array array 题意 输入n和k,表示输入n个整数和可以擦除的次数k,如果至多擦除k次能是的数组中的序列是不上升或者是不下降序列,就是魔力数组,否则不是. 解题思 ...

  10. 解读经典《C#高级编程》第七版 Page68-79.对象和类型.Chapter3

    前言 新年好,本篇开始进入第三章,<对象和类型>,深刻理解C#的对象,对于使用好.Net类库非常重要. 01 类和结构 从使用角度看,结构和类的区别很小,比如,将结构定义转换为类,只需要将 ...