VUE 学习六 发送带参数请求

 

 

排查

一开始，使用 data: {
                           qid: 111,
                           courseId: 110
                           act: get_hand
                          }传递参数，但是这样并不成功,

                this.$axios({

                    url:'https://xdev.xxx.com:6543/ajax_live.php',
                    method:'POST',
                    data: {
                        'qid': 2981269,
                        'course_id': 4308,
                        'chapter_id': 3298,
                        'act': 'get_handout_list',
                    }

                })

 

 

而使用 url:'https://xdev.xxx.com:6543/ajax_live.php?qid=2981269&course_id=4308&chapter_id=3298&act=get_hand',却是成功的。

两者区别，查看XHR header

 

 

 

解决：

     应该是参数传递形式问题，借鉴网上资料，做出以下修改，就正确了

        methods:{

            getHandoutList (){

                //传参数 方法一
                let params={
                    'qid': 2981269,
                    'course_id': 4308,
                    'chapter_id': 3298,
                    'act': 'get_handout_list',
                }
                let qs=require('qs')
                let qsParam=qs.stringify(params);

                //方法二
                // let qsParam = new URLSearchParams();
                // params.append('qid', 2981269);
                // params.append('course_id', 4308);
                //
                // params.append('chapter_id', 3298);
                // params.append('act', 'get_handout_list');

                this.$axios({
                     // url:'https://xdev.xxx.com:6543/ajax_live.php?qid=2981269&course_id=4308&chapter_id=3298&act=get_handout_list',
                    url:'https://xdev.xxx.com:6543/ajax_live.php',
                    method:'POST',
                    data: qsParam

                })
                    .then(res=>{
                        let ret=res.data
                        if(ret.errcode!==0){
                            return this.$message({
                                type:"warning",
                                message:ret.msg
                            })
                        }

                        this.handoutListData = ret.handout_list
                        this.dialogVisible = true
                    })


            }
        }