Vue.js之使用axios进行get、post传参

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/SevenGirl2017/article/details/88717071

axios

定义

基于Promise的HTTP客户端,用于浏览器和node.js

特征

  • 做的XMLHttpRequest从浏览器
  • 让HTTP从node.js的请求
  • 支持Promise API
  • 拦截请求和响应
  • 转换请求和响应数据
  • 取消请求
  • 自动转换JSON数据
  • 客户端支持防范XSRF

安装

三种方式,均可进行

$  npm install axios    //使用npm
$  bower install axios   //使用bower
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>    //通过cdn直接调用

使用

发送一个Get请求

添加引用

import axios from 'axios';

使用模板

axios.get(url).then(function (response) {
	//具体操作
	console.log(response.data);
}).catch (function (error) {
	console.log(error);
}

具体实例

无参数

var url =  'http://192.168.**.***:8080/Card';
   axios.get(url).then(function(response) {
     if (response.data == false) {
        this.$Message.success("注册成功");
     } else {
       this.$Message.info("注册失败");
     }
   });

有参数

需要进行字符串拼接

var id = 001;
var url =  'http://192.168.**.***:8080/Card';
url += 	`?cardId=${id}`;//拼接字符串
   axios.get(url).then(function(response) {
     if (response.data == false) {
        this.$Message.success("注册成功");
     } else {
       this.$Message.info("注册失败");
     }
   });

发送一个Post请求

添加引用

import axios from 'axios';
import qs from 'qs';

使用模板

axios.post('url', {
    数据库字段1: 'value',
    数据库字段2: 'value'
  }
  )
  .then(function (response) {
   //具体操作
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

具体实例(一)

var url =  ''http://192.168.**.***:8080/Card'; 
      axios
        .post(
          addurl,
          qs.stringify({
            cardId:001,
            password: '1',
            Name: ‘Seven’,
            status: '使用',
          })
        )
        .then(function(response) {
          if (response.data == true) {
            vm.$Notice.open({
              title: '注册成功',
              duration: 2 //n秒后消失
            });
          } else {
            vm.$Notice.open({
              title: '注册失败',
              duration: 2 //n秒后消失
            });
          }
        })
        .catch(err => {
          console.log(err);
        });

具体实例(二)

var url =  ''http://192.168.**.***:8080/Card'; 
      axios
        .post(
          addurl,
            {
            cardId:001,
            password: '1',
            Name: ‘Seven’,
            status: '使用',
          }
        )
        .then(function(response) {
          if (response.data == true) {
            vm.$Notice.open({
              title: '注册成功',
              duration: 2 //n秒后消失
            });
          } else {
            vm.$Notice.open({
              title: '注册失败',
              duration: 2 //n秒后消失
            });
          }
        })
        .catch(err => {
          console.log(err);
        });
展开阅读全文

没有更多推荐了,返回首页