簡體   English   中英

如何從 Python 循環中填充 2 列卡

[英]How to fill 2 column cards from Python loop

在此處輸入圖像描述 我試圖遍歷 Python 列表以填寫 2 個居中的語義 UI 卡的行,但不知道如何正確填寫該行中的第二張卡。 目前我的代碼中有字符串“嘿”,但在此之前我有“用戶”,但當然是兩次獲得同一個用戶:/

     [![enter image description here][1]][1]<div class="ui two column centered grid">
        {% for user in users %}
          <div class="four column centered row">
            <!-- card 1 -->
            <div class="column"><div class="ui card">
              <div class="image">
                <img src="/static/images/matthew.png">
              </div>
              <div class="content">
                <a class="header" href="{{ url_for('show', id=user.id)}}">{{ user.first_name }}</a>
                <div class="meta">
                  <span class="date">Joined in 2013</span>
                </div>
                <div class="description">
                  {{ user.first_name }} is a surfer living in Aguadilla.
                </div>
              </div>
              <div class="extra content">
                <a>
                  <i class="user icon"></i>
                  22 Friends
                </a>
              </div>
            </div></div>
            <!-- card 2 -->
            <div class="column">hey</div>
          </div>
        {% endfor %}
      </div>

如果您有平面列表[0, 1, 2, 3, ...]而不是[ [0,1], [2,3], ...]那么您可以嘗試使用切片與zip()進行轉換它。

使用users[0::2]您可以獲得偶數用戶(0,2,4, ...)

使用users[1::2]您可以獲得奇數用戶(1,3,5, ...)

並將它與zip()一起使用,您可以創建對(0,1), (2,3), ...您可以使用它們創建帶有兩張卡片的行。

for user1, user2 in zip(users[0::2], users[1::2]):
    # ... create card1 with user1 ...
    # ... create card2 with user2 ...

我不知道zip()是否可以在模板中使用,但最終您可以使用此方法創建列表[ [0,1], [2,3], ...] ,然后再將其發送到模板。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM