背景:

因为公司后端接口在路径携带参数时候，没有值的参数不能携带，否则报错，所以自己写了一个小方法过滤处理 下面是 原来请求的携带方式 丑不拉几

export function test(params:any) {
    return request({
        url: `/api/test?a=${params.a}&b=${params.b}`,
        method: 'GET',
        baseURL,
    })
}

代码

1.ts写法

export function urlJoin(url: string, params: any) { //这种传入对象参数无论是否空值全部携带
    let jUrl = `${url + '?'}`
    for (let key in params) {
        jUrl += `${key + '=' + params[key] + '&'}`
    }
    let relUlr = jUrl.slice(0, jUrl.length - 1)
    return relUlr
}

export function urlJoinFilter(url: string, params: any) { //过滤表单里面空值，因为请求接口时候空值不能带上去
    let jUrl = `${url + '?'}`
    for (let key in params) {
        if (params[key] !== '' && params[key] != null) {//判断有值才携带，可以加其他判断，具体看实际情况来
            jUrl += `${key + '=' + params[key] + '&'}`
        }
    }
    let relUlr = jUrl.slice(0, jUrl.length - 1)
    return relUlr
}

2.在api模块引入

import { urlJoinFilter } from "@/utils/system/urlJoin"


export function test(params: any) { 
    let url = urlJoinFilter(`/api/test`, params)
    return request({
        url: url,
        method: 'GET',
        baseURL
    })
}

3.vue调用引入api模块 使用

 await test({a:'',b:'1'})