[英]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.