zoukankan      html  css  js  c++  java
  • Django前后端结合

    静态页面已经显示了,导航、文章内容都是在数据库中导出来的,要怎么处理呢

    1、修改导航

    在views.py中加入以下内容

    def index(requset):
        navs = ['my的首页','my的相册','my的代码']
        title = 'my的相册'
        dic = {'daohang' : navs,'daohang2':title}
        return render(requset,'index.html',dic) #render方法会自动找到templates中的index.html,读取他的内容

    在index.html中找到导航的文字,替换成两个大括号夹着关键字

          <li><a href="index.html">{{ daohang}}</a></li>
          <li><a href="share.html">{{ daohang2 }}</a></li>

    2、如何使用字典循环

    (1)先循环导航,将index.html中的以下内容

    复制代码
    <header class="header-navigation" id="header">
      <nav><div class="logo"><a href="/">杨青个人博客</a></div>
        <h2 id="mnavh"><span class="navicon"></span></h2>
        <ul id="starlist">
          <li><a href="index.html">网站首页</a></li>
          <li><a href="share.html">我的相册</a></li>
          <li><a href="list.html">我的日记</a></li>
          <li><a href="about.html">关于我</a></li>
          <li><a href="gbook.html">留言</a></li>
          <li><a href="info.html">内容页</a></li>
          <li><a href="infopic.html">内容页</a></li>
        </ul>
    </nav>
    </header>
    复制代码

    替换成

    复制代码
    <header class="header-navigation" id="header">
      <nav><div class="logo"><a href="/">杨青个人博客</a></div>
        <h2 id="mnavh"><span class="navicon"></span></h2>
        <ul id="starlist">
            {%  for nav in daohang %}
          <li><a href="index.html">{{ nav }}</a></li>
            {% endfor %}
        </ul>
    </nav>
    </header>
    复制代码

     (2)将views.py中的内容写成这样

    复制代码
    def index(requset):
        navs = ['my的首页','my的相册','my的代码','python','linux']
        title = 'my的个人博客'
        articles = [ #r如何使用循环写法
            {'title': '文章1', 'content': '文章111111111'},
            {'title': '爱情没有永远,地老天荒也走不完', 'content': '也许,爱情没有永远,地老天荒也走不完,生命终结的末端,苦短情长。站在岁月的边端,那些美丽的定格,心伤的绝恋,都被四季的掩埋'},
        ]
        dic = {'daohang' : navs,'title':title,'articles':articles}
    
        return render(requset,'index.html',dic) #render方法会自动找到templates中的index.html,读取他的内容
    复制代码

     (3)接着循环文章

    原始文章是这样的

    复制代码
     <div class="r_box">
          <li><i><a href="/"><img src="/static/images/1.jpg"></a></i>
          <h3><a href="/">你是什么人便会遇上什么人</a></h3>
          <p>有时就为了一句狠话,像心头一口毒钉,永远麻痺着亲密感情交流。恶言,真要慎出,平日多誠心爱语,乃最简易之佈施。</p>
        </li>
        <li><i><a href="/"><img src="/static/images/2.jpg"></a></i>
          <h3><a href="/">爱情没有永远,地老天荒也走不完</a></h3>
          <p>也许,爱情没有永远,地老天荒也走不完,生命终结的末端,苦短情长。站在岁月的边端,那些美丽的定格,心伤的绝恋,都被四季的掩埋,一去不返。徒剩下这荒芜的花好月圆,一路相随,流离天涯背负了谁的思念?</p>
        </li>
        <li><i><a href="/"><img src="/static/images/3.jpg"></a></i>
          <h3><a href="/">女孩都有浪漫的小情怀——浪漫的求婚词</a></h3>
          <p>还在为浪漫的求婚词而烦恼不知道该怎么说吗?女孩子都有着浪漫的小情怀,对于求婚更是抱着满满的浪漫期待,也希望在求婚那一天对方可以给自己一个最浪漫的求婚词。</p>
        </li>  
      </div>
    复制代码

    改成

    复制代码
      <div class="r_box">
    
          {% for article in articles %}
              
        <li><i><a href="/"><img src="/static/images/1.jpg"></a></i>
          <h3><a href="/">{{ article.title }}</a></h3>
          <p>{{ article.content }}</p>
        </li>
    
          {% endfor %}
      
      </div>
    复制代码

    views.py中的内容写成这样

    复制代码
    def index(requset):
        navs = ['my的首页','my的相册','my的代码','python','linux']
        title = 'my的个人博客'
        articles = [ #r如何使用循环写法
            {'title': '文章1', 'content': '文章111111111'},
            {'title': '文章2', 'content': '文章22222222'},
            {'title': '文章3', 'content': '文章33333333'},
            {'title': '爱情没有永远,地老天荒也走不完', 'content': '也许,爱情没有永远,地老天荒也走不完,生命终结的末端,苦短情长。站在岁月的边端,那些美丽的定格,心伤的绝恋,都被四季的掩埋'},
        ]
        dic = {'daohang' : navs,'title':title,'articles':articles}
    
        return render(requset,'index.html',dic) #render方法会自动找到templates中的index.html,读取他的内容
    复制代码
  • 相关阅读:
    这里有20位程序员关于求职的疑惑,还好也有参考答案
    非科班小白如何逆袭,成功跨考985软件工程?!
    springmvc之RequestMapping中的请求参数和请求头
    springmvc之RequestMapping中的请求方式
    springmvc之RequestMapping注解既可以修饰类也可以修饰方法
    springmvc之第一个springmvc程序
    python之列表推导和生成器表达式
    python之容器序列和扁平序列
    python之利用魔术方法实现自己定义的二维向量
    spring之整合struts2
  • 原文地址:https://www.cnblogs.com/haifeima/p/11886345.html
Copyright © 2011-2022 走看看