Я хочу установить пользовательское свойство в теге v-for, как показано ниже, но как я могу получить эту опору в методе `computed`?

Question

Я хочу установить пользовательское свойство в теге v-for, как показано ниже, но как я могу получить эту опору в методе computed?

Как мне получить пользовательский реквизит 'data-index' здесь? Потому что я хочу установить класс для каждого элемента индивидуально по индексу. Я пробовал $ attrs.dataIndex, $ dataset.index, $ dataset.dataIndex, ..., но никто не работает.

<li v-for="(item, index) in dataSource" :key="index" :class="classForItem"> 
// …
</li>

computed: {
    classForItem() {
      // How can I get the custom prop 'data-index' here? Because I want to set class for every item individually by index.
      // I have tried $attrs.dataIndex, $dataset.index, $dataset.dataIndex, ..., but no one is worked.
    }
  }

Answer 1

Ваш вопрос не совсем понятен, но, насколько я понимаю, вы хотите получить индекс цикла в вычисляемом свойстве. Это невозможно с вычисляемым свойством.

Если вы хотите получить индекс, вам нужно будет переместить вычисляемое свойство ClassForItem в объект 'method' и отправить в качестве аргумента 'index', например:

<li v-for="(item, index) in dataSource" :key="index" :class="classForItem(index)"> 
// …
</li>

methods: {
    classForItem(index) {
      console.log(index)
    }
  }

В качестве альтернативы, если вы хотите получить доступ к элементам набора данных, вы можете использовать это:

<li v-for="(item, index) in dataSource" :key="index" :class="classForItem"> 
// …
</li>

methods: {
    classForItem(event) {
       console.log(event.target.dataset.index)
    }
  }