使用Django构建个人网站（七）——前后端数据交互，展示博客

今天我的计划就是把博客展示到页面上——完成前后端交互。

目录

一、视图处理函数

二、前端静态页面转动态界面

---

一、视图处理函数

./blog/views.py文件中代码如下。

from django.shortcuts import render
from django.http import HttpResponse
from .models import Blog, Category

# Create your views here.


def blog_list(request):
    categories = Category.objects.all()
    blogs = Blog.objects.all()
    for blog in blogs:
        blog.published = blog.published.strftime("%Y-%m-%d %H:%I:%S")
    context = {}
    context['blogs'] = blogs
    context['categories'] = categories
    return render(request, 'blog.html', context=context)

主要就是运用ORM，查询到所有的博客，然后格式化时间日期，返回给前端。

二、前端静态页面转动态界面

在这里，主要是修改这个部分：

我的目的就是让每一个博客都能加载出来。

原来的这部分代码如下：

                

                    

                        
 技术天地
                            第一篇博客
                        
                        

                            

                                
                            
                            

                                
这是博客的正文内容，展示他的正文。这是博客的正文内容，展示他的正文。这是博客的正文内容，展示他的正文。这是博客的正文内容，展示他的正文。
                            
                            

                                


                                
                                

                                    阅读
                                
                                

                                    点赞
                                

                                    评论
                                

                                
                            
                        
                    

这是一篇博客的内容，对他进行改写，加载后台传过来的数据：

{% extends "base_cn.html" %}
{% block title %}
我的博客
{% endblock %}
{% block content %}



    
    

        

            
            

                
                

                    
                    

                        

                        

                        

                    
                    
                    

                        

                            
                            

                            
                        
                        

                            
                            

                            
                        
                        

                            
                            

                            
                        
                    

                    
                    
                        
                        Previous
                    
                    
                        
                        Next
                    
                
                
                {%for blog in blogs %}
                

                    

                        
 {{blog.category}}
                            {{blog.title}}
                        
                        

                            

                                
                            
                            

                                
{{blog.body|truncatechars:30}}
                            
                            

                                

                                    {{blog.author}}
                                
                                

                                    
                                
                                

                                    
                                

                                    
                                

                                    {{blog.published}}
                                
                            
                        
                    
                
                {% endfor %}
            
            
            

                
                

                    
个人简介
                    

                    
                    
                    

                        
姓名:王雄
                        
性别:男
                        
我的技能:Python、HTML、css、JavaScript、Django、Flask、MySQL、MongoDB、spider、数据科学分析
                        
                        
Email:Email:[email protected]
                    
                
                
                

                    

                        
                            
                        
                        

                            

                                
                            
                        
                    
                    

                        
                            
                        
                        

                            

                                
                            
                        
                    
                    

                        
                            
                        
                        

                            

                                
                            
                        
                    
                    

                        
                            
                        
                        

                            

                                
                            
                        
                    
                
                
                

                    
文章分类
                    

                        
技术空间
                        
分享、研究有关IT技术的一切
                        
生活琐事
                        

                        
游戏频道
                        

                        
情感生活
                        

                    
                
                

                    
最受欢迎
                
                

                    
文章归档
                
                

                    
热门文章
                
                

                    
最近评论
                
                

                    
标签云
                
            
        
    

{% endblock %}

 使用for循环加载每一篇博客，就这用双大括号传值，即可轻松显示，如下图所示：