如何在打字稿中输入 URLSearchParams 来接收对象？

Question

我有一个函数通过参数接收一个对象，这个对象进入 URLSearchParams，之后，我创建一个 toString() 并得到以下答案：

const object = {
    name: 'Test',
    age: 20
};

function exampleFunction(objectExample) {

   const url = new URLSearchParams(objectExample);
   return url.toString();
};

console.log(exampleFunction(object));
// result: name=Test&age=20

答案结果如我所料，问题是当我尝试输入此参数创建接口时，例如：

interface ObjectTest { name: string, age: number }

 function exampleFunction(objectExample: ObjectTest) {
    
       const url = new URLSearchParams(objectExample: ObjectTest) << /* error, URLSearchParams expect a type Record<string, string> */;
       return url.toString();
    };

不用输入，代码工作正常，我的问题是：如果我的 URLSearchParams 需要其他东西，我如何输入这个参数来接收对象？我已经尝试传递对象 stringfy（如 JSON.stringfy(object)，但结果类似于 // %7B%22ma,e%22%3A%22Test%22%2C%22age%age%22#A @)%70= 而不是 name=Test&age=20 )

Answer 1

URLSearchParams接受一个对象作为参数，但对象的所有值都必须是字符串。

Record 是实用程序类型。 Record<string, string> 是为键和值为字符串的对象指定的类型。

因此您可以将 age 转换为字符串以修复错误：

interface ObjectTest { name: string, age: number }

function exampleFunction(objectExample: ObjectTest) {
    const url = new URLSearchParams({...objectExample, age: objectExample.age.toString()})
    return url.toString();
};

Playground

如何在打字稿中输入 URLSearchParams 来接收对象？

How type URLSearchParams in typescript to receive an object?

types

typescript

urlsearchparams