Как передать index в before?

Question

У меня есть массив , можно ли как-то передать значение index в before: { content: '{{ index }}'; }

const app = new Vue({
   el: '#app',
   data() {
      return {
      
      }
   },

});

.container {
  width: 100%;
  height: 94px;
  display: flex;
  column-gap: 5px;
}
.item {
  position: relative;
  height: 6px;
  width: 26px;
  border-radius:3px;
  background: black;
}
.item__lvlpromo::before {
  position: absolute;
  content: '{{ index }}';
  bottom: 15px;
 width: 64px;
  height: 64px;
  border-radius: 50%;
  background: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<ul id="app" class="container">
                  <li class="item" v-for="(lvl,index) in 49" :key="index">
                     <!--{{ index % 2 === 0 || index === 0 ? index : '' }}-->
                  </li>
               </ul>

Answer 1

Для решения данной пробелмы , я добавил :data-index="index" к массиву , а для того чтобы в before я смог принять данный индекс , я переедал данной значение в него content: ' ' attr(data-index) ' '; Финальный код выглядит так

   const app = new Vue({
       el: '#app',
       data() {
          return {
          
          }
       },

    });

    .container {
      width: 100%;
      height: 94px;
      display: flex;
      column-gap: 5px;
    }
    .item {
      position: relative;
      height: 6px;
      width: 26px;
      border-radius:3px;
      background: black;
    }
    .item::before {
      position: absolute;
    content: ' ' attr(data-index) ' ';
      top: 50px;
     width: 64px;
color: white;
      height: 64px;
      border-radius: 50%;
      background: red;
    }

   <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
    <ul id="app" class="container">
                      <li class="item" v-for="(lvl,index) in 49" :key="index" :data-index="index">
                         <!--{{ index % 2 === 0 || index === 0 ? index : '' }}-->
                      </li>
                   </ul>

БЛОГ НА HUSL

Как передать index в before?

Ответы (1 шт):