vue+element-get和post进行请求传递数据类型（data || params）

秒速五厘米 2022-03-17 02:16 478阅读 1赞

最近一直在写vue项目，发现很多的坑是之前没见过的，这是一件好事，毕竟踩坑的过程就是一个学习的过程，往后的一段日子可能更新vue的会比较多，毕竟是在写vue的项目，我写的可能是一些比较简单浅显的东西，但是我毕竟是一个vue的初学者。不是大神，所以会根据自己学到的和用到的一些知识不断的由浅入深的进行推进，高手就当温习，新手就当学习。

今天写的是时候遇到一个问题吗，我们的后端出于安全的考虑，我们处理数据的时候是只做两种处理请求的，第一种是get也就是查询，所有的查询都是get请求，更新，新增和删除都是post请求。那么我和后端进行交互的时候使用的axios进行的请求，那么在写的过程中，有的时候是需要传递参数的，例如条件查询，是需要将条件传过去的，那么这个时候就涉及到传值类型的问题了，我开始这样写的：

searchIndoBySel : function(){
    let that = this;
            this.$axios({
            method : ‘get',
            url : url,
            data:{
               name = that.name,
               age = that.age,
               sex = that.sex
            }
    
        }).then(function(res){
             if(res.data.message == 'success’){
                that.tableDate = res.data.result;
             }else{
                console.info(res.data.message)
             }
        }).catch(function(err){
                console.info(err.data.message)
        })
    }

代码是我直接在csdn编辑器里面写的，所以没有进行验证是不是对的，但是大概就是这样的，就是一个简单的发送请求，但是请求的时候一直拿不到请求头的信息，开始的时候我一直以为是后端的问题，但是后来我直接用postman请求的时候是没有任何的问题的，所以我定位的问题就是发送的格式是不对的，那么怎么更改呢？于是就开始加各种JSON.stringify什么的进行格式的转换，但是都是无济于事的（最主要的远还是因为我比较菜，大神看不下去的可以撤离战场了。）

然后打开vue的文档开始翻看，后来明白了是参数请求的就不对，正确的get请求的写法应该是下面这样的：

searchIndoBySel : function(){
    let that = this;
            this.$axios({
            method : ‘get',
            url : url,
            params:{
               name = that.name,
               age = that.age,
               sex = that.sex
            }
    
        }).then(function(res){
             if(res.data.message == 'success’){
                that.tableDate = res.data.result;
             }else{
                console.info(res.data.message)
             }
        }).catch(function(err){
                console.info(err.data.message)
        })
    }

是的就一点点的区别的，但是区别其实是很大的，下面进入正题，今天的讲解部分，这里说一下data和params的区别。

data是进行post请求的时候用的，那么它的参数其实是写到了请求体里面去了，而不是在url后面当作参数拼到后面的，那么get请求其实是需要将参数拼到url后面进行传递的，所以这里是需要用到params这个关键字了。这个就是用于get请求的，一般我们的get请求就是将参数作为url拼接的对象进行操作的，所以这里使用params才是正解。

由于工作时间的原因，每天只能晚上更新博客，就不多写了，写的不好的不全的或者不严谨的还望见谅！相互学习。

谢谢阅读！