คำถามติดแท็ก gsap

สิ่งที่เรียบง่ายนี้ควรทำได้อย่างง่ายดาย แต่ฉันกำลังดึงผมออกว่ามันซับซ้อนแค่ไหน สิ่งที่ฉันต้องการทำคือทำให้การติดตั้งและการยกเลิกการต่อเชื่อมคอมโพเนนต์ React เป็นแบบเคลื่อนไหว นี่คือสิ่งที่ฉันได้ลองทำไปแล้วและสาเหตุที่แต่ละวิธีใช้ไม่ได้ผล: ReactCSSTransitionGroup - ฉันไม่ได้ใช้คลาส CSS เลยมันเป็นสไตล์ JS ทั้งหมดดังนั้นจึงใช้ไม่ได้ ReactTransitionGroup- API ระดับล่างนี้ยอดเยี่ยม แต่คุณต้องใช้การโทรกลับเมื่อภาพเคลื่อนไหวเสร็จสมบูรณ์ดังนั้นเพียงแค่ใช้การเปลี่ยน CSS จะไม่ทำงานที่นี่ มีไลบรารีแอนิเมชั่นอยู่เสมอซึ่งนำไปสู่ประเด็นต่อไป: GreenSock - การออกใบอนุญาตมีข้อ จำกัด มากเกินไปสำหรับการใช้งานทางธุรกิจ IMO React Motion - ดูเหมือนจะดี แต่TransitionMotionก็สับสนและซับซ้อนเกินไปสำหรับสิ่งที่ฉันต้องการ แน่นอนว่าฉันสามารถใช้กลอุบายได้เช่นเดียวกับ UI ของวัสดุโดยที่องค์ประกอบต่างๆถูกแสดงผล แต่ยังคงซ่อนอยู่ ( left: -10000px) แต่ฉันไม่อยากไปเส้นทางนั้น ฉันคิดว่ามันแฮ็คและฉันต้องการให้ส่วนประกอบของฉันยกเลิกการต่อเชื่อมเพื่อทำความสะอาดและไม่เกะกะ DOM ฉันต้องการสิ่งที่ง่ายต่อการนำไปใช้ เมื่อเมานต์ให้สร้างชุดสไตล์ให้เคลื่อนไหว เมื่อยกเลิกการต่อเชื่อมให้เคลื่อนไหวชุดรูปแบบเดียวกัน (หรืออื่น) เสร็จแล้ว นอกจากนี้ยังต้องมีประสิทธิภาพสูงในหลายแพลตฟอร์ม ฉันเคยชนกำแพงอิฐที่นี่ หากฉันทำอะไรหายไปและมีวิธีง่ายๆในการดำเนินการนี้โปรดแจ้งให้เราทราบ

103 animation  reactjs  css-animations  gsap  react-motion