javascript - ส่ง prop Children ไปยังคอมโพเนนต์ React Memo
ฉันกำลังอยู่ในกระบวนการปรับแต่งส่วนประกอบ React SFC จำนวนหนึ่งโดยใช้ React.memo
ส่วนประกอบเหล่านี้ส่วนใหญ่มีลูก โครงการนี้ยังใช้ TypeScript ด้วย
ฉันเริ่มรู้สึกว่าคอมโพเนนต์ memo ไม่รองรับลูกหลาน เนื่องจากฉันได้รับข้อความแสดงข้อผิดพลาดต่อไปนี้ทุกครั้งที่เกิดข้อผิดพลาด:
คุณสมบัติ 'children' ไม่ปรากฏอยู่ในประเภท 'IntrinsicAttributes & object'
ปรากฏว่าสิ่งนี้ใช้ได้เฉพาะเมื่อฉันระบุประเภท Props ให้กับคอมโพเนนต์ เช่น
const MyComponent: React.SFC<PropType>หากฉันลบประเภทของ prop (ดังที่แสดงด้านล่าง) ข้อผิดพลาดก็จะไม่เกิดขึ้น
const MyComponent: React.SFCแน่นอน ฉันต้องการประเภทพร็อพในเกือบทุกกรณี
ฉันได้ตั้งค่า Code Sandbox ที่จำลองปัญหาไว้:
https://codesandbox.io/s/cool-keldysh-urddu?fontsize=14&hidenavigation=1&theme=dark
tl;dr: ทำไมคอมโพเนนต์ React.memo ถึงไม่รับ prop ของลูกเมื่อมีการระบุชนิดสำหรับ props ของคอมโพเนนต์?
คำตอบ #1
นี่ดูเหมือนจะเป็นปัญหากับการพิมพ์ React.memo ซึ่งมันไม่ได้ส่งต่อ props ของ children โดยอัตโนมัติ มีการอภิปรายเกี่ยวกับเรื่องนี้ใน repo ของ DefinitelyTyped
ตอนนี้ คุณสามารถระบุ prop children ด้วยตนเองได้:
type ChildProps = {
name: string;
children: React.ReactNode;
};
