第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

vuejs多層循環(huán)嵌套,怎么獲取一個連續(xù)的index

vuejs多層循環(huán)嵌套,怎么獲取一個連續(xù)的index

繁華開滿天機 2019-02-13 14:58:23
如題,有一個多維數(shù)組,需要在最深層打印一個index,我希望這個index是連續(xù)的即,對于以下的代碼<ul id="example-1">        <li v-for="item in items">            <div v-for="v in item">                {{index}} {{v}}            </div>        </li>    </ul> var example1 = new Vue({        el: '#example-1',        data: {            items: [                ['a', 'b', 'c'],                ['e', 'f']            ]    }    });代碼中的index就是我說的連續(xù)的index,他應該是1,2,3,4,5···這種形式,而不是vue v-for中通過$index獲取的0,1,2,0,1我試圖通過在data中聲明一個變量listIndex專門記錄這個索引變量,在每次v-for循環(huán)中自增,但是實現(xiàn)時有問題,如果直接寫{{listIndex++}},會導致listIndex自增無限循環(huán)觸發(fā),頁面卡死。以上.
查看完整描述

1 回答

?
蕪湖不蕪

TA貢獻1796條經驗 獲得超7個贊

官網上有這么一句話:


值得注意的是只有當實例被創(chuàng)建時 data 中存在的屬性是響應式的。也就是說如果你添加一個新的屬性,像:


vm.b = 'hi'

那么對 b 的改動將不會觸發(fā)任何視圖的更新


這個問題的產生關鍵恰好就是vue實例中data的自動響應,所以解決辦法也很簡單:在創(chuàng)建實例之后再添加index即可:


<template>

  <div>

     helloworld

     <router-link :to="{name:'Mypage'}"> 1111</router-link>

     <ul id="example-1">

        <li v-for="(item, index1) in items">

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

            {{ getIndex () }}

            </div>

        </li>

    </ul>

  </div>

</template>

<script>

export default {

  name: 'HelloWorld',

  data () {

    return {

      items: [

        ['a', 'b', 'c'],

        ['e', 'f', 'a', 'b', 'c', 'a', 'b', 'c']

      ]

    }

  },

  methods: {

    getIndex () {

      if (!this.index) {

        this.index = 1

      } else {

        this.index++

      }

      return this.index

    }

  }

}

</script>


滿意請采納,有問題繼續(xù)探討


查看完整回答
反對 回復 2019-02-15
  • 1 回答
  • 0 關注
  • 1680 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號