הבנת הירושה של תבנית ב-Django

הבנת הירושה של תבנית ב-Django
קוראים כמוך עוזרים לתמוך ב-MUO. כאשר אתה מבצע רכישה באמצעות קישורים באתר שלנו, אנו עשויים להרוויח עמלת שותף. קרא עוד.

אחת התכונות החזקות ביותר של Django היא היכולת שלה לעשות שימוש חוזר בקוד באופן דינמי. ירושה של תבניות מאפשרת שיתוף של קוד בין תבניות הורה וילד. זה מפחית מאוד כפילות במאמץ.





ל-Django יש שפת תבניות המיועדת להתמזג עם HTML. יהיה לך קל לעבוד עם התבניות של Django אם עבדת בעבר עם קוד HTML. לשפות תבנית אחרות מבוססות טקסט כמו Smarty או Jinja2 יש תחביר דומה.





איפור של סרטון היום

בואו ללמוד עוד על תורשת תבניות על ידי בניית פרויקט Django.





מהי תבנית ג'נגו?

ב-Django, תבנית היא קובץ טקסט שיכול ליצור כל פורמט מבוסס טקסט, כגון HTML, XML או CSV.

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



ל-Django יש הרבה תגים מובנים, שנראים כמו {% tag %} . תגים מועילים במובנים רבים. הם יכולים ליצור טקסט בפלט, לבצע לולאות ולטעון מידע לתוך התבנית.

אתה תשתמש בתגים בפרויקט זה כדי להדגים את תורשת התבנית.





צור פרויקט ג'נגו

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

צור פונקציית תצוגה

ראשית, צור א נוף פונקציה שמציגה את התבניות. במקרה זה, אתה תעבד את ה index.html תבנית. ייבא את לְדַקלֵם שיטה מקיצורי ג'נגו. לאחר מכן צור פונקציית תצוגה בשם index שמחזירה ומציגה את תבנית האינדקס.





CC82DAA3D0EBAE3F46C39C4669BA58B5C1E7EF6

צור נתיב כתובת אתר

לאחר מכן, צור א נתיב כתובת אתר עבור פונקציית התצוגה כדי להציג את התבניות. ייבא את נָתִיב פונקציה מ-django.urls ו- נוף לתפקד מ views.py קוֹבֶץ. לאחר מכן ייבא הגדרות ו סטָטִי כדי לעבד כל תמונה ומדיה שיש לך בתבניות.

from django.urls import path 
from . import views
from django.conf import settings
from django.conf.urls.static import static
urlpatterns=[
path('',views.index,name='index'),
]
if settings.DEBUG:
urlpatterns+=static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

צור תבניות

עכשיו שיש לך את נוף ו כתובת אתר נתיב, צור את התבניות. כדי להדגים את תורשת התבנית, צור א base.html כתבנית אב. ה base.html לקובץ יהיו רכיבים כלליים שאיתם ברצונך לשתף index.html , תבנית הילד.

{% load bootstrap5 %} 
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- titles -->
{% if title %}
<title> Inherited Templates {{title}}</title>
{% else %}
<title> Inherited Templates </title>
{% endif %}
{% block styles %}
{% bootstrap_css %}
<link rel="stylesheet" href="{% static 'css/style.css' %}">
{% endblock %}
</head>
<body>
{% include 'navbar.html' %}
{% block content %} {% endblock %}
<!-- Bootstrap links -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"> </script>
</body>
</html>

ראשית, טען את ה- Bootstrap והתלות הסטטית על ה- base.html תבנית. אתה יכול השתמש במסגרת Bootstrap עם פרויקט ה-Django שלך לסגנון דפי HTML. התלות הסטטית הנטענת בחלק העליון תטען נכסים הכלולים בתיקייה הסטטית.

macbook air m1 לעומת macbook pro m1

תבניות Django מאפשרות לך להעביר פיסות היגיון האחראיות להצגת תוכן. תגי תבנית מורכבים מטקסט מוקף ב-' {% ' ו ' %} תווים. ה אחרת הצהרה בודקת תנאים בפונקציית התצוגה. אם התנאי נכון הוא מציג את התוכן בבלוק הראשון; אם שקר, זה יציג את התוכן בשנייה.

ה base.html הקובץ גם יציג את התוכן של navbar.html בדיוק במקום שבו אתה מציב את תגי התבנית. זה אומר בכל פעם שאתה מרחיב את base.html , navbar.html עובר גם בתורשה. כל תבנית המרחיבה את base.html יירש כל אלמנט עם an {% כוללים %} תָג.

כל טקסט מוקף ב {{}} הוא משתנה תבנית. משתני תבנית הם נתונים דינמיים המסופקים על ידי פונקציות תצוגה. ג'נגו משתמש גם בתגי חסימה שמשתמשים בתג פתוח, כמו {% block content %} , ותג סגירה, כמו {% endblock %} .

תגי חסימה מאפשרים לתבניות הצאצא לעקוף את התוכן של תבניות האב. במקרה זה, ה index.html יכול להחליף את התוכן שלו באזור המוקף בתגי בלוק. זה לא יפריע לאחר base.html רכיבים.

איך לפרוץ מכשירים המחוברים ל- wifi שלי

בואו ליישם את ההיגיון על index.html

{% extends 'base.html' %} 
{% block content %}
<div class="container text-center" style="color: white">
<h1>I Am The Index Template</h1>
<p>I inherited Bootstrap and the navbar from base.html</p>
</div>
{% endblock %}

בתוך ה index.html תבנית, השתמש ב- {% הארכת %} תג להרחבת רכיבים של base.html . בתוך תגי הבלוק {% block content %} , כתוב את כל הקוד שלך.

בתוך ה index.html תבנית, יש לך H1 ואלמנט פסקה. אתה יכול להשתמש בתגיות התבנית בתוך ה-divs כדי לקרוא למשתנים מה- נוף פוּנקצִיָה.

בדוק ירושה של תבנית בדפדפן

כעת אתה יכול להפעיל את השרת. לאחר שעשית זאת, בדוק בדפדפן כדי לראות אם index.html הקובץ ירש את הרכיבים של base.html . זה כולל קישורי Bootstrap וה- navbar.html תבנית.

  index.html עם navbar מ-base.html

ה index.html הקובץ אמור לרשת את סגנונות ה-navbar ואת Bootstrap מתבנית הבסיס. אם כן, השתמשת בירושה של תבנית בצורה נכונה. בלעדיו, היית צריך להוסיף את סרגל הניווט וקישורי Bootstrap היכן שהיית צריך אותם.

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

ירושה של תבנית היא אחת מהדרכים הרבות שבהן ג'נגו מיישם את עקרון ה-Don't Repeat Yourself (DRY). זה יהפוך את הפיתוח שלך להרבה יותר קל ופשוט.

מדוע כדאי להשתמש בירושה של תבנית Django

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

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

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

על ידי לימוד מערכת תבניות Django, תוכלו ליהנות מכתיבת קוד נקי וחזק.