Как получить все элементы списка, используя ref?

Question

Я знаю, как получить родителя ul, просто выполнив this.$refs.listOfItems, но не знаю, как получить все li в списке ul.

Я также знаю способ выполнения JSэто document.getElementById("listOfItems").getElementsByTagName("li"); но, как уже упоминалось выше, я ищу помощников, предлагаемых Vue.js, таких как this.$refs

<template>
  <ul id="listOfItems" ref="listOfItems">
    <li v-for="item in items">{{ item.name }}</li>
  </ul>
</template>

<script>
  export default {
    mounted: {
      let ul = this.$refs.listOfItems
      let lis =  // HOW TO GET ALL LIs using `this.$refs.listOfItems`
    }
  }
</script>

Answer 1

Я думаю, вы хотели поставить v-for на <li> вместо <ul>. Если вы поместите ref в элемент, который повторяется с v-for, то это будет массив элементов.

<ul>
  <li v-for="item in items" ref="items">{{ item.name }}</li>
</ul>

this.$refs.items[0];  // The first <li>