在反应 js 中循环本地存储数据并形成 API url 参数

Question

我在 React 中有一个下面的函数，可以根据 localstorage 中的内容获取形成 api url 的键，这个函数非常完美，但我想对其进行优化，并有一个 map 函数而不是重复。

getFiltersFromLocal() {

let formurl = (localStorage.getItem(videoUrl) ? '&' + 'videoUrl=' + localStorage.getItem(videoUrl) : '') 
            
+ (localStorage.getItem(tvenName) ? '&' + 'enName=' + localStorage.getItem(tvenName) : '') 
            
+ (localStorage.getItem(tvGender) ? '&' + 'tvGender=' + (localStorage.getItem(tvGender)) : '')
            
+ (localStorage.getItem(tvStatus) ? '&' + 'tvStatus=' + (localStorage.getItem(tvStatus)) : '')

return formurl

}

为了优化这一点，我尝试了以下但没有运气。

getFiltersFromLocal() {
const localfilterdata = {
            "data": [
              {
                "keysToCheck": [videoUrl,tvenName,tvGender,tvStatus,tvidFrom,tvidTo,tvsortorderFrom,tvsortorderTo,tvstartFrom,tvstartTo,tvendFrom,tvendTo,tvsearch]
              },
              {
                "apiparams": ["videoUrl=","enName=","tvGender=","tvStatus=","idFrom=","idTo=","sortOrderFrom=","sortOrderTo=","startDateFrom=","startDateTo=","endDateFrom=","endDateTo=","search="],
              }
            ]
        }
    localfilterdata.data.map(k => {
            let formurl = localStorage.getItem(k.keysToCheck) ? '&' + k.apiparams + localStorage.getItem(k.keysToCheck) : ''
            return formurl
        })
}

注意：这个函数会根据localstorage中的item形成url，并附加到url中。下面的示例网址

https://example.com/getTvList?size=20&page=1&tvStatus=INACTIVE&enName="sample"

使用如下函数：

url = FETCH_URL + '?size=' + stateData.pageSize + '&page=' + stateData.currentPage + this.getFiltersFromLocal()

Answer 1

嘿，我只是假设你试图做这样的事情，

const localfilterdata = {
    "keysToCheck": ['videoUrl','tvenName','tvGender','tvStatus','tvidFrom','tvidTo','tvsortorderFrom','tvsortorderTo','tvstartFrom','tvstartTo','tvendFrom','tvendTo','tvsearch'],
    "apiparams": ["videoUrl=","enName=","tvGender=","tvStatus=","idFrom=","idTo=","sortOrderFrom=","sortOrderTo=","startDateFrom=","startDateTo=","endDateFrom=","endDateTo=","search="]
}
localfilterdata.keysToCheck.map((k,index) => {
    let formurl = localStorage.getItem(k) ? '&' + localfilterdata.apiparams[index] + localStorage.getItem(k) : ''
    return formurl
}).join('')