Vue + css реализует раскрывающееся меню

    <div class="dropdown fleft">
      <!-- <button class="dropbtn listxx">更多赛事</button> -->
      <div class="dropbtn listxx">更多赛事</div>
      <div class="dropdown-content">
        <a href="javascript:;" :data-id="item.id" :data-index="index+8" @click="dianjilist($event)" v-for="(item, index) in listqt" :key="index">{
   
   { item.name }}</a>
      </div>
    </div>
2./* 下拉菜单 */

.dropbtn { // граница: нет; // верхний край: 3px; курсор: указатель; размер шрифта: 15 пикселей; фон: rgba (0,0,0,0.0); // наброски: нет; }

.dropdown { позиция: относительная; // отображение: встроенный блок; }

. dropdown-content { display: none; позиция: абсолютная; // цвет фона: # f9f9f9; фон: rgba (0,0,0,0.5); минимальная ширина: 104 пикселей; z-индекс: 8888; // тень коробки: 0px 8px 16px 0px rgba (0,0,0,0.2); }

.dropdown-content a { color: #fff; отступ: 12 пикселей 16 пикселей; текстовое оформление: нет; дисплей: блок; z-индекс: 8888; }

.dropdown-content a: hover { font-weight: bold; }

.dropdown: наведите указатель мыши. dropdown-content { display: block; }