특정 인덱스에서 v-for 루프를 시작하는 방법

특정 인덱스에서 v-for 루프를 시작하는 방법

시작 방법v-for특정 색인을 반복하다

예제: 주어진 배열array = [a,b,c,d,e,f];

나는 사용하길 원한다.v-for3번째 요소에서 루핑을 시작하는 루프.고마워 :)

표준 슬라이스 방법만 사용하십시오.

new Vue({
  el: '#app',
  data: {
    items: [
      'aaa',
      'bbb',
      'ccc',
      'ddd',
      'eee',
      'fff'
    ]
  }
})

<script src="https://unpkg.com/vue@2.4.2/dist/vue.min.js"></script>

<div id="app">
  <ul>
    <li v-for="item in items.slice(2)">{{ item }}</li>
  </ul>
</div>

PS: 또는 v-for with v-if:

new Vue({
  el: '#app',
  data: {
    items: [
      'aaa',
      'bbb',
      'ccc',
      'ddd',
      'eee',
      'fff'
    ]
  }
})

<script src="https://unpkg.com/vue@2.4.2/dist/vue.min.js"></script>

<div id="app">
  <ul>
    <li v-for="(item, index) in items" v-if="index >= 2">{{ item }}</li>
  </ul>
</div>

또는 사용자 지정 기능을 사용할 경우:

new Vue({
  el: '#app',
  data: {
    items: [
      'aaa',
      'bbb',
      'ccc',
      'ddd',
      'eee',
      'fff'
    ]
  },
  methods: {
    startFrom (arr, idx) {
      return arr.slice(idx)
    }
  }
})

<script src="https://unpkg.com/vue@2.4.2/dist/vue.min.js"></script>
    
<div id="app">
  <ul>
    <li v-for="item in startFrom(items, 2)">{{ item }}</li>
  </ul>
</div>

계산된 값을 사용할 수 있음 소스

    <template>
      <div class="message">

   <div v-for="(item , index) in getArray">


    <span>{{item}}</span>

</div>

</div>
    </template>

    <script>

      export default {
        name: 'message',
         data () {
           return{
               array:['a','b','c','d','e']
             }
        },
        methods:{

        },
        computed:{
            getArray(){
                    const arr = this.array.filter((item , index)=>{
                             return index > 1; //will return the array from the second value
                      })
                  return arr;
            }
        }
      }

    </script>

    <style>


    </style>

필터 방법을 사용하면 계산된 값뿐만 아니라 디스플레이에서도 배열을 반복해야 한다.어레이의 시작 요소를 알고 있다면 슬라이스를 사용하는 것이 좋다. <div v-for="(item , index) in array.slice(1,array.length)"> 또는 계산된 값 ``"을 여전히 사용하고자 할 것.

computed:{
  getArray(){
    return this.array.slice(1,this.array.length)
  }
}

나는 계산된 값을 사용하는 것을 추천한다.

참조URL: https://stackoverflow.com/questions/46140707/how-to-start-a-v-for-loop-at-a-specific-index