前端技术加强-html模板应⽤
❖ 页⾯的继承(⽗模板与⼦模板),扩展及导⼊
❖ {% include 'navbar.html' %}
❖ {% extends 'main.html' %}
❖ {% block content %}
❖ <h1>主页home模板</h1>
❖ {% endblock %}
❖
步骤
1、建⽴navbar.html⽂件
2、建⽴home.html⽂件
3、建⽴room.html⽂件
4、建⽴main..html
5、def home(request):
return render(request, "home.html", context)
def room(request):
return render(request, "room.html")通过url中参数传递进⼊不同页⾯1
❖ 总结:从后端通过响应往前端页⾯传递数据使⽤【返回值】 render(,,context)
❖ 从前端通过url参数/<str:pk> —->对应的⽅法的【⼊参】 room(request,pk)
❖ 1、urls.py
❖ path('room/<str:pk>/', views.room,name='房间')
❖ 2、views.py
❖ def room(request,pk):
❖ 3、home.html
❖ {% for room in rooms %}
❖ <h3>{{room.id}} -- <a href="/room/{{room.id}}">{{room.title}}</a></h3>
❖ {% endfor %}通过url中参数传递进⼊不同细节
❖ 4、获取所有的数据包括id,并改为Article类(显⽰⽂章)
❖ rooms = models.Article.objects.values()
❖ 5、在返回的 判断符合 的id后将这个 id的内容显⽰在页⾯中。
❖ def room(request, pk):
❖ room=models.Article.objects.get(id=pk)
❖ context={'room':room}
❖ return render(request, "room.html", context)
❖ 6、room.html
❖ <h1>{{room.title}}</h1>