קורס React 2020 שיעור תרגול פקדים

הי

זה עובד לך? כי מקריאת הקוד נדמה לי שכאשר את משנה את ערך השעות לדוגמא אז את לא תקבלי 3600 בשדה השניות אלא את המספר שכתבת בתיבה השעות
(כלומר נסי לכתוב 1 בשדה השעות ותראי אם את מקבלת 3600 שניות)

היי,
בקוד ששלחתי בצילום מסך, עובד מעולה (גם כשממלאים בכל השדות)

כן בצילום מסך הקוד הרבה יותר טוב ונראה עובד.

אגב - יש לך רעיון איך לכתוב את הפונקציה check רק פעם אחת?

היי תודה…
ניסיתי ממש הרבה זמן וזו הדרך היחידה שהצלחתי
אתה יכול לכוון אותי?

אני מראה רעיון דומה בקורס JavaScript הרגיל באתר בשיעור טיפול באירועים (הפונקציה bind, או שימוש בפונקציות חץ). כדאי לצפות בקורס כאן:
https://www.tocode.co.il/bundles/frontend

שיעורים 38-45 ואני בטוח שזה ייתן לך השראה

היי ינון,
כדי להוסיף מודול לפרויקט בריאקט כתבתי את הפקודה npm install tinycolor2
בחלון cmd בתוך תיקיית הדוגמאות C:\Users\Hani\react\react2020-course-examples-master>
והוצגה לי ההודעה הזאת->

מה אני צריכה לעשות?

ההודעה לא נוראית npm אוהב לזרוק אזהרות על המון דברים לא חשובים. הכי קל להתעלם.

מה שכן הפקודה שלך היתה צריכה להיות:

npm install --save-dev tinycolor

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

     תודה !                                              .........................

היי ינון,
קודם כל תודה על ההכוונה…
האם זה הפתרון
ורק הכתיב לא נכון?

הכיוון טוב מאוד. מה בדיוק לא עובד?

וואי תודה!!

התכנית לא רצה…כנראה הכתיב שלי לא נכון ואני לא מוצאת למה…

מה הודעת השגיאה שאת מקבלת
?

התכנית כאילו לא נותנת לי לכתוב בתיבת טקסט של השעות והדקות

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

האם פונקצית החץ לא אמורה להיות כתובה באירוע onChange או שהבעיה היא במשהו אחר?00

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

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

  1. import React from “react”;

  2. import ReactDom from “react-dom”;

  3. import { useState } from ‘react’;

  4. export default function pakadim (props){

  5. const [value,setText]=useState(“Type Something”);

  6. function handleChangeOfText(e)

  7. {

  8.   setText(e.target.value);
    
  9. }

  10. return(
    
  11.     <div>
    
  12. <input type="text" value={value} onChange={handleChangeOfText}/>   
    
  13. <input type="text" value={value} onChange={handleChangeOfText}/>   
    
  14. <input type="text" value={value} onChange={handleChangeOfText}/>   
    
  15. <input type="text" value={value} onChange={handleChangeOfText}/>   
    
  16. <input type="text" value={value} onChange={handleChangeOfText}/>  
    
  17.     </div>
    
  18. )
    
  19. }

  20. זו התשובה שלי לשאלה הראשונה אך יש בה משהו לא תקין אשמח לקבל עזרה!

יכולה להדביק שוב בלי מספרי השורות - שאני אוכל להעתיק את זה לסביבת פיתוח שלי?

הי ינון

לא מבין את הכוונה כאן
“לאחר מכן עדכנו את הפקד כך שיוכל לקבל בתור Property ערך של צבע שיוצג לפני שמשתמש בחר את הצבע הראשון”

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

<ColorSelector defaultColor="red" />