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

תחומים - פורום חרדי מקצועי

💡 רוצה לזכור קריאת שמע בזמן? לחץ כאן!
  1. דף הבית
  2. תכנות
  3. vue components, frame for childs components

vue components, frame for childs components

מתוזמן נעוץ נעול הועבר תכנות
15 פוסטים 5 כותבים 251 צפיות
  • מהישן לחדש
  • מהחדש לישן
  • הכי הרבה הצבעות
התחברו כדי לפרסם תגובה
נושא זה נמחק. רק משתמשים עם הרשאות מתאימות יוכלו לצפות בו.
  • chagoldC מנותק
    chagoldC מנותק
    chagold
    כתב ב נערך לאחרונה על ידי chagold
    #1

    אני רוצה לעשות קומפוננט שיהוה מסגרת, ויציג בפנים קומפוננטים אחרים (שישלחו כפרמטרים בקריאה לקומפוננט).

    (הצורך לזה הוא לדוגמא כשיש שדה של 'לקוח', וצריך לעשות 'איתור לקוח', או שדה של 'תאריך' וכמו"כ צריך לפתוח תיבה לבורר תאריכים, ושהוא יסגר כשאני גומר את האיתור ובוחר.
    אני יכול להשתמש בתיבות פופאפ לכל דבר ויש לזה כבר קומפוננטים מוכנים אבל זה לא טוב לחווית משתמש).

    בשביל לשלוח נתונים לקומפוננט יש את props. אבל לא הצלחתי להכניס לprops קומפוננט ילד.

    דוגמא מינימלית:

    קומפוננט האב

    <template>
        <div>
            {{component_child}}
        </div>
    </template>
    
    
    <script>
        export default {
            props:['component_child'],
    	};
    </script>
    

    וכדי לשלוח אליו נתונים אמורים לקרוא לו איךשהוא ככה:

    <component :component_child="component_child"></component>
    
    

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

    מוטי אורןמ תגובה 1 תגובה אחרונה
    0
    • מוטי אורןמ מנותק
      מוטי אורןמ מנותק
      מוטי אורן
      השיב לchagold ב נערך לאחרונה על ידי מוטי אורן
      #2

      @chagold לא לגמרי הבנתי מה הצורך, אבל לפי מה שהבנתי נראה לי ש slots יכול לעזור לך לממש את מה שאתה צריך.
      תנסה לראות כאן https://vuejs.org/guide/components/slots.html

      D תגובה 1 תגובה אחרונה
      4
      • ח מנותק
        ח מנותק
        חוקר
        כתב ב נערך לאחרונה על ידי חוקר
        #3

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

        רפאלר תגובה 1 תגובה אחרונה
        0
        • רפאלר מנותק
          רפאלר מנותק
          רפאל
          השיב לחוקר ב נערך לאחרונה על ידי
          #4
          פוסט זה נמחק!
          תגובה 1 תגובה אחרונה
          0
          • D מנותק
            D מנותק
            davidnead
            כתב ב נערך לאחרונה על ידי davidnead
            #5

            אם הבנתי נכון את צרכיך, התשובה לשאלותיך זה התחביר הבא:

            <componnet :is="componnetName"></componnet>
            

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

            <child1 v-if="componnetName=='child1'"></child1>
            
            <child2 v-else-if="componnetName=='child2'"></child2>
            
            <child3 v-else-if="componnetName=='child3'"></child3>
            
            <child4 v-else-if="componnetName=='child4'"></child4>
            
            רפאלר תגובה 1 תגובה אחרונה
            2
            • D מנותק
              D מנותק
              davidnead
              השיב למוטי אורן ב נערך לאחרונה על ידי
              #6

              @מוטי-אורן אמר בvue components, frame for childs components:

              @chagold לא לגמרי הבנתי מה הצורך, אבל לפי מה שהבנתי נראה לי ש slots יכול לעזור לך לממש את מה שאתה צריך.
              תנסה לראות כאן https://vuejs.org/guide/components/slots.html

              בניסיון לקרוא את השאלה שלך שוב, נראה שהפתרון הזה יותר מתאים לך. הוא מעניק לך יותר גמישות ושליטה יותר ישירה מקומפוננט האב/סבא.

              תגובה 1 תגובה אחרונה
              2
              • רפאלר מנותק
                רפאלר מנותק
                רפאל
                השיב לdavidnead ב נערך לאחרונה על ידי רפאל
                #7

                @davidnead אמר בvue components, frame for childs components:

                רק לשים לב שאתה לא פטור מלייבא את הקופמוננט:

                @davidnead איך זה היה אמור לעזור לשואל השאלה?? קראת את השאלה שלו??

                למען האמת ניתן להימנע מיבוא כולל של הקומפוננטות מראש באמצעות השימוש בAsyncComponent העושה שימוש בDynamic Import כבדוגמא דלהלן (דוגמא זו מניחה שכל הקומפוננטות שישלחו נמצאות תחת מיקום אחד, ולכן לדעתי אינה מהווה פתרון עבור שואל השאלה):

                <template>
                  <component :is="component"></component>
                </template>
                
                <script>
                import { defineAsyncComponent } from "vue";
                
                export default {
                  props: {
                    componentName: {
                      type: String,
                      default: () => "DefaultComponent",
                    }
                  },
                  computed: {
                    component() {
                      return defineAsyncComponent(() => import(`./${this.componentName}.vue`));
                    }
                  }
                };
                </script>
                
                D תגובה 1 תגובה אחרונה
                0
                • D מנותק
                  D מנותק
                  davidnead
                  השיב לרפאל ב נערך לאחרונה על ידי
                  #8

                  @רפאל אמר בvue components, frame for childs components:

                  @davidnead אמר בvue components, frame for childs components:

                  אם הבנתי נכון את צרכיך, התשובה לשאלותיך זה התחביר הבא:

                  @davidnead איך זה היה אמור לעזור לשואל השאלה?? קראת את השאלה שלו??

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

                  רפאלר תגובה 1 תגובה אחרונה
                  0
                  • רפאלר מנותק
                    רפאלר מנותק
                    רפאל
                    השיב לdavidnead ב נערך לאחרונה על ידי רפאל
                    #9

                    @davidnead שואל השאלה זקוק לפתרון להצגת קומפוננטות בצורה דינמית (לא State Machine). איך הפתרון שלך עוזר?

                    D תגובה 1 תגובה אחרונה
                    0
                    • D מנותק
                      D מנותק
                      davidnead
                      השיב לרפאל ב נערך לאחרונה על ידי davidnead
                      #10

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

                      אם הוא באמת צריך גמישות רבה למגוון תרחישים (כמו שכנראה אתה הנחת) הפתרון היותר סביר הוא כנראה SLOT. ושוב, הכל מתוך ניחוש מה הצרכים שלו.

                      רפאלר תגובה 1 תגובה אחרונה
                      1
                      • רפאלר מנותק
                        רפאלר מנותק
                        רפאל
                        השיב לdavidnead ב נערך לאחרונה על ידי רפאל
                        #11

                        @davidnead יבוא מראש זה בדיוק ההגדרה לאי-דינמיות, באותה מידה אפשר ליצור <Dictionary<Key, Component ולהחליט על מפתח שרירותי שיועבר בין הקומפוננטות.

                        @davidnead אמר

                        אני רואה שערכת את התשובה הקודמת שלך, והוספת שם את אותו פתרון

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

                        D תגובה 1 תגובה אחרונה
                        0
                        • D מנותק
                          D מנותק
                          davidnead
                          השיב לרפאל ב נערך לאחרונה על ידי
                          #12

                          @רפאל אמר בvue components, frame for childs components:

                          @davidnead יבוא מראש זה בדיוק ההגדרה לאי-דינמיות, באותה מידה אפשר ליצור <Dictionary<Key, Component ולהחליט על מפתח שרירותי שיועבר בין הקומפוננטות.

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

                          רפאלר 2 תגובות תגובה אחרונה
                          0
                          • רפאלר מנותק
                            רפאלר מנותק
                            רפאל
                            השיב לdavidnead ב נערך לאחרונה על ידי
                            #13
                            פוסט זה נמחק!
                            תגובה 1 תגובה אחרונה
                            0
                            • רפאלר מנותק
                              רפאלר מנותק
                              רפאל
                              השיב לdavidnead ב נערך לאחרונה על ידי רפאל
                              #14
                              פוסט זה נמחק!
                              D תגובה 1 תגובה אחרונה
                              0
                              • D מנותק
                                D מנותק
                                davidnead
                                השיב לרפאל ב נערך לאחרונה על ידי
                                #15

                                @רפאל אמר בvue components, frame for childs components:

                                עלול להוות דיס-אינפורמציה.

                                זו האשמה עוד יותר חריפה. ברוסיה יושבים עליה כיום 15 שנים בכלא.

                                תגובה 1 תגובה אחרונה
                                0

                                בא תתחבר לדף היומי!
                                • התחברות

                                • אין לך חשבון עדיין? הרשמה

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