Javascript 在ReactJS中为URLSearchParams添加条件

我有一个表，它调用以下函数来获取数据

export function fetchAddressRecords(itemsPerPage,page,sortBy,orderBy,query) {
  let p = new URLSearchParams();
  p.append("pageSize", itemsPerPage || 10);
  p.append("pageNumber", page || 1);
  p.append("keySelector", sortBy || "addressId");
  p.append("orderBy", orderBy || "asc");
  p.append("query", query || "");

  return fetch("http://localhost:6505/api/v1/address?" + p).then(
   response => response.json(),
  );
}

此时，获取数据的URL返回

http://localhost:6505/api/v1/address?pageSize=10&pageNumber=1&keySelector=addressId&orderBy=asc&query=

我想做的是，仅在“query”参数有值时追加它。所以返回的URL应该是

http://localhost:6505/api/v1/address?pageSize=10&pageNumber=1&keySelector=addressId&orderBy=asc

但如果有人在搜索框中键入，则url将再次包含“查询”

---

这可能吗？或者我总是需要显示一个空的“查询”来开始？这会影响api获取数据的方式吗？

您可以使用一个快捷条件，因此只有在有查询时才附加查询：

export function fetchAddressRecords(itemsPerPage,page,sortBy,orderBy,query) {
  let p = new URLSearchParams();
  p.append("pageSize", itemsPerPage || 10);
  p.append("pageNumber", page || 1);
  p.append("keySelector", sortBy || "addressId");
  p.append("orderBy", orderBy || "asc");
  query && p.append("query", query);

  return fetch("http://localhost:6505/api/v1/address?" + p).then(
   response => response.json(),
  );
}

为了解释，js中的值是“truthy”，这意味着它们可以像布尔值一样处理，将解析为true或false。在您的例子中，查询要么是一个字符串（计算结果为true），要么是未定义的字符串（计算结果为布尔值时为false）

所以它是：

query &&  p.append("query", query);

以下哪一项成为：

false && [does not get evaluated]

或

在使用

&&

作为这样的快捷方式时，您必须稍微小心，因为例如，数字0的计算结果为false，即使它是“已定义的”。但是，在您的情况下，只要您有一个字符串，它就会计算为

true

：

false && true //false
0 && true // false
"0" && true // true
"false" && true // true

---

let should be const“这会影响api获取的方式吗”。。。我们无法知道什么是必需的，什么不是。非常简单，您可以在浏览器地址栏或使用rest客户端工具（如Postanthanks@Jin）测试自己。我会更改它。谢谢@charlietfl，我会研究一下使用Postanthen的目的是什么

|

？@WillJenkins非常感谢您昨天的帮助，您能解释一下新代码行的作用吗？我只是假设“query”存在，然后附加“query”，但是&&让我感到厌烦。我添加了更多解释-这有帮助吗？

false && true //false
0 && true // false
"0" && true // true
"false" && true // true