[Vuejs]-How initialize tabs when state changes in vue?

by

0👍

Your code looks correct. But it doesn’t work, you can try a computed property:

v-for="c in count"

computed: {
   count() {
     return myCount
   }
}

0👍

Your data option should be a function that returns an object data(){ return { myCount: 5 } } not a field with object as value :

Vue.config.devtools = false;
Vue.config.productionTip = false;

new Vue({
  el: '#app',
  data(){
    return {
      myCount: 5
    }
  },
  methods: {
    showOneTab() {
      this.myCount = 1
    }
  }
})
<link type="text/css" rel="stylesheet" href="//unpkg.com/bootstrap/dist/css/bootstrap.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>


<div id="app" class="container">


  <div v-for="c in myCount" :key="c">
    {{ c }}
  </div>

  <button type="button" @click="showOneTab">Show just one tab</button>
</div>

Leave a comment