שימוש ב-useEffect - חלק 2

תמלול ההרצאה: שימוש ב-useEffect - חלק 2

הטקסט המלא של הדקות הראשונות בהרצאה «שימוש ב-useEffect - חלק 2» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.

1. 00:02

   אז אנחנו רוצים רק להפעיל כאן את קומפוננט ויל אנד מאונט שאפשר לנו להרוס את הטיימר כי ברגע שהקומפוננט הזה הולך להיות להיהרס על ידי ריאקט אנחנו לא רוצים שהטיימר ימשיך בדיוק כמו שעשינו בקלאס קומפוננט בקלאס קומפוננט היה לנו את קומפוננט ויל אנד מאונט והרגנו את הטיימר היינו צריכים רק לקחת את ה-ID שלו פה אז מה אנחנו רוצים לבצע?

2. 00:33

   אנחנו רוצים קודם כל לקחת את ה-ID, טיימר ID, בואו רגע נעתיק את הקוד הזה וניגש לפה. סט אינטרוול מחזירה לנו טיימר ID, האמת אין לי דיס, יש לי, טעם משתנה, טיימר ID. אנחנו רוצים מתישהו לשלוח את הטיימר ID הזה

3. 00:53

   בכדי להגיד ל-JavaScript להפסיק את האינטרוול. אנחנו רוצים לעשות את זה פעם אחת, לפני שהקומפוננט נהרס. איך עושים את זה?

4. 01:03

   useEffect. רגע, איך פונקציה אחת יכולה לדמות שלוש פונקציות? didUpdate, didMount וגם willUnmount.

5. 01:13

   אז מה שהיא אומרת לנו זה דבר כזה, אם אתם רוצים לבצע פונקציה שהיא willUnmount, כל מה שאתם צריכים לעשות זה toReturn, פשוט תחזירו לי פונקציה, הנה פונקציה, וזאת הפונקציה שהיא will unmount.

6. 01:34

   זאת הפונקציה שריאקט תריץ שנייה לפני שהקומפוננט נהרס. מה אתם רוצים לעשות בפונקציית הזו? מה אני רוצה לעשות בפונקציה?

7. 01:43

   אני רוצה לקרוא ל-window.clearinterval ולשלוח את הטיימר ID. בואו רגע נסתכל שזה בדיוק מה שעשינו. clearinterval, שלחנו את הטיימר ID. אותו הדבר, אנחנו מבצעים פה וזה ה-Will Unmount.

8. 02:09

   בואו נרשום את זה כאן. זה Component Will Unmount. זה בדיוק הטכניקה לביצוע.

9. 02:21

   החזרת פונקציה, המערכת אוטומטית תריץ אותה והיא תריץ אותה פעם אחת שנייה לפני שהקומפוננט נהרס. אם הקומפוננט לא הולך להיהרס, אף אחד לא יריץ את הפונקציה שלנו.

10. 02:29

    בואו רק נראה שהדברים עובדים כי אנחנו לא יכולים לראות כרגע שהקומפוננט נהרס שאין לנו כרגע ראוטינג ומעבר למקום אחר והריסת