显示具有对象和图标的数组

const items = [
  { name: 'Item 1', icon: 'icon1.png' },
  { name: 'Item 2', icon: 'icon2.png' },
  { name: 'Item 3', icon: 'icon3.png' },
  // ...
];

<div class="array-container">
  <!-- 使用循环遍历数组中的对象 -->
  {% for item in items %}
    <div class="item">
      <img src="{{ item.icon }}" alt="{{ item.name }} icon">
      <span>{{ item.name }}</span>
    </div>
  {% endfor %}
</div>

.array-container {
  display: flex;
  flex-wrap: wrap;
}

.item {
  display: flex;
  align-items: center;
  margin: 10px;
}

.item img {
  width: 50px;
  height: 50px;
  margin-right: 10px;
}

.item span {
  font-size: 16px;
}