zoukankan      html  css  js  c++  java
  • vue实现ajax请求(vue-resource和axios)

    1、vue-resouce实现ajax请求

      vue1中主要用vue-resouce实现ajax请求,

     2.1 引用vue-resouce

       引入axios,直接在index.html文件中引入;

      

      或者在main.js文件中引入vue-resouce.js,并use  vue-resouce;

      

     2.1 使用vue-resouce

      三种ajax请求的方式

     

     后面可以接{headers: {}} 设置请求头

    2、axios实现ajax请求

     2.1 引用axios

      vue2.0版本已不推荐使用vue-resouce发送ajax请求,推荐使用axios发送请求;

      一:直接在index中引入vue.js和axios.js文件,

         <script src="js/vue.min.js"></script>

        <script src="js/axios.min.js"></script>

      或者在main.js文件中导入axios,import axios from ‘axios’,将axios设置在vue中的原型中Vue.prototype.axios = axios

     2.2 使用axios

      在组件中需要发送ajax请求的地方(后一种方法引入的axios改为this.axios):

      axios.type(url, params).then(function(res){

        成功回调

      }).catch(function(res){

        失败回调

      });

      或者: 

      axios({

        method: type,

        url: '',

        data: {}

      }).then(function(res){

        成功回调

      }).catch(function(res){

        失败回调

      });

      axios不支持跨域请求,如果要进行跨域请求,那么使用vue-resouce获取jquery发送ajax请求。

      注: axios是一个基于Promise的HTTP请求;关于Promise示例:

      

  • 相关阅读:
    Navicat For SQL Server 修改字段为自增主键
    navicat for sql server 12下载地址
    git 同时关联多个远程库
    Mysql general_log 日志详解
    angular教程
    Python代码写好了怎么运行?
    python mysql自增字段AUTO_INCREMENT值的修改方式
    Python自学教材推荐 初学者必看
    永久性差异
    如何关闭搜狗的流氓弹窗广告
  • 原文地址:https://www.cnblogs.com/daijing/p/10402241.html
Copyright © 2011-2022 走看看