请教loop里如何单独定义某条数据的样式

CSDN移动问答

如图,我想制作这么一个类似metro样式的效果,代码里需要给数据单独定义样式,我使用的是开源程序,模板里是直接使用loop输出循环结果的,请问如何才能给loop里数据单独定义样式? 或者是能单独输出loop里的某条数据也可以啊,请帮帮忙,谢谢啦。

在 loop 循环中为单独的数据定义样式,你可以使用条件标签或者在循环的过程中计数器来控制样式。


例如,如果你希望给奇数和偶数行分别定义不同的样式,可以使用条件标签:

{% for item in items %}
  {% if loop.index is odd %}
    <div class="odd-row">{{ item }}</div>
  {% else %}
    <div class="even-row">{{ item }}</div>
  {% endif %}
{% endfor %}

如果你希望给每隔几项定义不同的样式,可以使用计数器:

{% for item in items %}
  {% if loop.index0 % 3 == 0 %}
    <div class="special-row">{{ item }}</div>
  {% else %}
    <div>{{ item }}</div>
  {% endif %}
{% endfor %}

还有一种方法是使用 filter,你可以使用内置的 divisibleby filter 来控制样式:

{% for item in items %}
  {% if loop.index0 is divisibleby 3 %}
    <div class="special-row">{{ item }}</div>
  {% else %}
    <div>{{ item }}</div>
  {% endif %}
{% endfor %}

如果你希望单独输出 loop 中的某条数据,你可以在循环中使用 break 关键字来终止循环,然后在循环外部输出需要的数据。

例如:

{% for item in items %}
  {% if item.special %}
    {{ item }}
    {% break %}
  {% endif %}
{% endfor %}

上面的代码会找到第一个 special 属性为 true 的数据,然后输出它,并终止循的循环。


另外,如果你想要输出 loop 中的所有特殊数据,你可以使用 continue 关键字跳过不需要的数据:

{% for item in items %}
  {% if not item.special %}
    {% continue %}
  {% endif %}
  {{ item }}
{% endfor %}

上面的代码会输出 loop 中所有的特殊数据。