ค้นหาเว็บไซต์

พิมพ์ URLSearchParams ใน TypeScript อย่างไรเพื่อรับวัตถุ?


ฉันมีฟังก์ชันที่รับวัตถุผ่านพารามิเตอร์ และวัตถุนี้จะเข้าไปใน 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 ของฉันคาดหวังสิ่งอื่น? ฉันได้ลองส่งอ็อบเจกต์เป็นสตริง (เช่น JSON.stringify(object)) แล้ว แต่ผลลัพธ์กลับเป็นบางอย่างเหมือน/%7B%22ma,e%22%3A%22Test%22%2C%22age%age%22#A@)%70= แทนที่จะเป็น name=Test&age=20

คำตอบ #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();
};

สนามเด็กเล่น

บทความที่เกี่ยวข้อง