ฉันเห็นว่า React.forwardRef น่าจะเป็นวิธีที่ถูกทำนองคลองธรรมในการผ่านการอ้างอิงไปยังองค์ประกอบการทำงานของเด็กจากเอกสารตอบสนอง:
const FancyButton = React.forwardRef((props, ref) => (
<button ref={ref} className="FancyButton">
{props.children}
</button>
));
// You can now get a ref directly to the DOM button:
const ref = React.createRef();
<FancyButton ref={ref}>Click me!</FancyButton>;อย่างไรก็ตามข้อดีของการทำเช่นนี้คือเพียงแค่ผ่านเสาที่กำหนดเอง:
const FancyButton = ({ innerRef }) => (
<button ref={innerRef} className="FancyButton">
{props.children}
</button>
));
const ref = React.createRef();
<FancyButton innerRef={ref}>Click me!</FancyButton>;ข้อได้เปรียบอย่างเดียวที่ฉันคิดได้ก็คืออาจมี API ที่สอดคล้องกันสำหรับการอ้างอิง แต่มีข้อได้เปรียบอื่นอีกหรือไม่? การส่งเสาที่กำหนดเองมีผลต่อการกระจายและทำให้เกิดการแสดงผลเพิ่มขึ้นหรือไม่แน่นอนว่าการอ้างอิงนั้นถูกเก็บไว้เป็นสถานะที่ไม่แน่นอนในcurrentสนาม
พูดเช่นคุณต้องการส่งการอ้างอิงหลายรายการ (ซึ่ง tbh ซึ่งอาจบ่งบอกถึงกลิ่นรหัส แต่ยังคง) จากนั้นทางออกเดียวที่ฉันเห็นคือการใช้อุปกรณ์ประกอบฉาก customRef
ฉันเดาคำถามของฉันคือมูลค่าการใช้forwardRefมากกว่าเสาที่กำหนดเองคืออะไร?