上章的結(jié)束,若在實際開發(fā)過程中,會發(fā)現(xiàn)一個問題,那就首頁或關(guān)注分享,是一下子按時間順序全部顯示出來,這在實際項目中不可能出現(xiàn)的,想想實際中的產(chǎn)品是如何做的?

一般來說,無非是兩種,一種是使用頁碼,來進行分頁,還有一種是js到頁底自動加載,而使用頁底自動加載的話,上一章實現(xiàn)的通過tab來區(qū)分全部和關(guān)注就不可取了,因為無法保證兩個tab加載的內(nèi)容數(shù)量一致,導(dǎo)致頁面布局就無法實現(xiàn),所以,這里首頁參考tumblr的實現(xiàn)方式,刪除關(guān)注分享的部分,只保留全部分享,使用js頁底動態(tài)加載分頁方式,同時在導(dǎo)航欄新增兩個導(dǎo)航,分別為博文,和關(guān)注,使用傳統(tǒng)頁碼的方式顯示全部博文和已關(guān)注博文,這樣是為了有些人可能會查詢比較久的歷史信息,所以,一個頁面,一個功能如何設(shè)計,主要取決于業(yè)務(wù)需求,而不是技術(shù)需求。首先修改導(dǎo)航(base.html):

 <ul class="nav navbar-nav">
    <li><a href="/">首頁</a></li>
    <li><a href="#">分享</a></li>
    {% if current_user.is_authenticated %}
    <li><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button"
           aria-haspopup="true" aria-expanded="false">關(guān)注 <span class="caret"></span></a>
      <ul class="dropdown-menu">
        <li><a href="#">分享</a></li>
        <li><a href="#">用戶</a></li>
      </ul>
    </li>
    {% endif %}
  </ul>

用戶登錄后,在首頁后面會新增兩個item,分別是分享和關(guān)注,其中關(guān)注是一個下拉菜單,分別是“我”關(guān)注的用戶發(fā)布的分享,和“我”關(guān)注的用戶

網(wǎng)友評論