axios的使用

最新推荐文章于 2023-08-16 08:58:28 发布

_shen_yu

最新推荐文章于 2023-08-16 08:58:28 发布

阅读量103

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/qq_46242907/article/details/118885436

版权

vue 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

本文介绍了如何在Vue项目中使用axios库进行HTTP请求，包括安装、引用和配置。重点讲解了GET和POST请求的实现，特别是POST请求中如何处理参数，以及后台使用body-parser解析请求体的方法。

摘要由CSDN通过智能技术生成

1-----下载

npm install axios -S

2----引用

import axios from 'axios';

Vue.prototype.$http = axios

3---get请求可以直接使用，但是post请求必须引入qs

接受post参数需要引入body-parser模块

npm i qs -S

在main.js中写引入的模块qs

import qs from 'qs';

Vue.prototype.$qs = qs;

引入body-parser模块

npm i body-parser -S

在后台server.js中写入

const bodyParser=require('body-parser')

var urlencodedParser = bodyParser.urlencoded({ extended: false })

app.post('/login',urlencodedParser,(req,res)=>{

  res.send(req.body)

})

在前端页面写入

 this.$http.post('http://localhost:8989/login', this.$qs.stringify({
                user:'Fred',
                pass:'Flintstone'
                }))
            .then(function (res) {
                console.log(res);
            })
            .catch(function (error) {
                console.log(error);
            })
            .then(function () {
                // always executed
            });