欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

将请求接口定义成全局变量,挂载到vue实例上可以全局使用,

程序员文章站 2024-02-15 13:13:22
...

将请求接口定义定义成全局变量,挂载到vue实例上可以全局使用,
随便写一个文件放请求接口,并导出。
将请求接口定义成全局变量,挂载到vue实例上可以全局使用,
在 main.js 文件中导入,并挂载。这样就可以在项目里使用。
将请求接口定义成全局变量,挂载到vue实例上可以全局使用,
使用案例
this.GLOBAL.myhf 调用的接口
login:地址
参数
username:,
password:

 axios .post( this.GLOBAL.myhf + "/login",  qs.stringify({
               username: that.formData.user.username,
              password: that.formData.user.password
          }),  { withCredentials: true } ) .then(function(response) {
          输出数据
                   console.log(response)
        })

将请求接口定义成全局变量,挂载到vue实例上可以全局使用,
多参数拼接
前台拿到的数据
this.info.pageNumber
后台参数
pageNum
pageNum

 axios.get( this.GLOBAL.myhf +"/role/search?pageNum=" + this.info.pageNumber + "&pageNum=" + this.info.pageSize,
          { withCredentials: true } ).then(function(response) {
          输出数据
        })

es模板字符串请求接口
模板字符,请求数据不用拼接数据

this.$axios.get(`http://192.168.124.7:8090/caregis/search?pageNum=${this.pageNum}&pageSize=${this.pageSize}`,{ withCredentials: true }).then(res=>{
                        if(res.data.info==="success"){
                            // 循环添加数据forEach方法
                        res.data.data.list.forEach(item => {    
                                this.list.push(item)
                        })
                        // 循环添加数据for需循环方发
                        // for(var i = 0; i < list.length; i++){
                        //    then.list.push(list[i])
                        // }
                        this.loading=false
                        // 获取总数
                        this.total = res.data.data.total
   }