用vue2写一个页面，页面顶部为高度180的幻灯片，下方为4*2导航图标

好的，我来为你提供一个示例代码：

<template>
  <div>
    <!-- 幻灯片 -->
    <div class="slider" style="height: 180px">
      <!-- 幻灯片内容 -->
    </div>

    <!-- 导航图标 -->
    <div class="nav-icons">
      <!-- 使用v-for指令遍历生成4*2个导航图标 -->
      <div class="nav-icon" v-for="(item, index) in 8" :key="index">
        <!-- 导航图标内容 -->
      </div>
    </div>
  </div>
</template>

<style>
  /* 定义幻灯片的样式 */
  .slider {
    /* 其他样式 */
  }

  /* 定义导航图标的样式 */
  .nav-icons {
    /* 其他样式 */
  }

  .nav-icon {
    /* 其他样式 */
  }
</style>

在上面的代码中，我们使用了一个 `div` 元素作为幻灯片，并使用 `style` 属性设置了高度为 180px。然后使用另一个 `div` 元素包裹导航图标，使用 `v-for` 指令遍历生成 4*2 个导航图标。你可以在 `template` 和 `style` 标签中继续定义幻灯片和导航图标的具体内容和样式。

注意：在使用 `v-for` 指令遍历生成多个元素时，要为每个元素添加一个 `key` 属性，以提高渲染性能。