美文网首页
Vue中的ajax

Vue中的ajax

作者: 名字是乱打的 | 来源:发表于2020-01-26 20:44 被阅读0次

    前言 vue-resource

    vue-resource是Vue.js的插件提供了使用XMLHttpRequest或JSONP进行Web请求和处理响应的服务。 当vue更新到2.0之后,作者就宣告不再对vue-resource更新,而是推荐的axios,在这里大家了解一下vue-resource就可以。vue-resource的github: https://github.com/pagekit/vue-resource

    1 axios

    Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中
    axios的github:https://github.com/axios/axios

    我们以restful风格开发为例,说明Vue中ajax的使用方式

    1. get请求

            //通过给定的ID来发送get请求 
            axios.get('/user?ID=12345') 
            .then(function(response){ 
                console.log(response);
                 })
            .catch(function(err){
                console.log(err);
                }); 
            
            //以上请求也可以通过这种方式来发送
            axios.get('/user',{
            params:{
                ID:12345
             }
             })
            .then(function(response){
            console.log(response);
             })
            .catch(function(err){
            console.log(err); 
            });
    

    2.post请求,带参数

    axios.post('/user',{ 
    firstName:'Fred', 
    lastName:'Flintstone'
     })
    .then(function(res){ 
    console.log(res); 
    })
    .catch(function(err){ 
    console.log(err);
     });
    
    为方便起见,为所有支持的请求方法提供了别名

    axios.request(config)
    axios.get(url[, config])
    axios.delete(url[, config])
    axios.head(url[, config])
    axios.post(url[, data[, config]])
    axios.put(url[, data[, config]])
    axios.patch(url[, data[, config]])

    相关文章

      网友评论

          本文标题:Vue中的ajax

          本文链接:https://www.haomeiwen.com/subject/hndzoctx.html