Django入门(三)配置模板传递参数

- 日理万妓 2024-04-17 14:45 82阅读 0赞

1.创建模板  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70]  
2.配置项目读取模板路径  
在DIRS 中添加 os.path.join(BASE\_DIR, ‘templates’)  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 1]  
使用pycharm创建项目的已经自动配置好的  
3.编写视图代码  
在应用视图中编写

from django.template import loader
    
    
    def index(request):
        tmp = loader.get_template('booktest/index.html')
        return HttpResponse(tmp.render())

4.查看效果  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 2]  
5.利用render 方法给模板渲染返回值

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 3]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 4]

from django.shortcuts import render
    from django.template import loader
    
    
    def index(request):
        context = {"hello":"world"}
    
        # tmp = loader.get_template('booktest/index.html')
        # return HttpResponse(tmp.render())
    
        return render(request,'booktest/index.html',context)

6.查看效果  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 5]  
7.模板中使用python 代码  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 6]  
视图代码

from django.shortcuts import render
    
    from booktest.models import BookInfo
    
    
    def index(request):
        # context = {"hello": "world"}
        #
        # # tmp = loader.get_template('booktest/index.html')
        # # return HttpResponse(tmp.render())
        # return render(request, 'booktest/index.html', context)
    
        book1 = BookInfo(btitle="123", bpup_date=timezone.now())
        book2 = BookInfo(btitle="123", bpup_date=timezone.now())
        book3 = BookInfo(btitle="123", bpup_date=timezone.now())
    
        bookList = []
        bookList.append(book1)
        bookList.append(book2)
        bookList.append(book3)
        context = {"bookList": bookList}
        return render(request, 'booktest/index.html', context)

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 7]  
html 代码

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    
    </head>
    <body>
    <h1>HELL0 WORLD</h1>
    <h2>{
       { hello }}</h2>
    
    <ul>
    {% for book in bookList %}
        <li>{
       { book.btitle }}</li>
    {%endfor%}
    </ul>
    </body>
    </html>

8.查看效果  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 8]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/61631337df344e638b5435ba43ed80b7.jpg
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 1]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/9b73f1b51dd74931825dd05eabb2a6d8.jpg
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 2]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/a3ff6d1418f345d3a28ee05f048859ce.jpg
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 3]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/fc22056138da494680788c125e68be61.jpg
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 4]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/4c3ff58e8c354fbdac14cca36940965c.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 5]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/cdf43f3fcf344d17b1e7766515e63dcd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 6]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/f6227e8ae5ff4f8581d635f556a67dd2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 7]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/58355a0e4c434c56a1d8df8e39e9968e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxMzgzMTc2_size_16_color_FFFFFF_t_70 8]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/54fd1649132445b9b4fe7e8f60d6d641.png