nested-repeat.html 1.0 KB

1234567891011121314151617181920212223242526272829303132
  1. <div id="test">
  2. <ul>
  3. <li v-repeat="items" v-class="'list-' + $index">
  4. <ul>
  5. <li v-repeat="items" v-class="'list-' + $index">
  6. {{$parent.$index + '.' + $index + ' : ' + $parent.title + '&lt;-' + title}}
  7. </li>
  8. </ul>
  9. </li>
  10. </ul>
  11. <button id="b0" v-on="click: items[0].title = 'hi'">1</button>
  12. <button id="b1" v-on="click: items[1].title = 'hi'">2</button>
  13. <button id="b0-0" v-on="click: items[0].items[0].title = 'hi'">1.1</button>
  14. <button id="b0-1" v-on="click: items[0].items[1].title = 'hi'">1.2</button>
  15. <button id="b1-0" v-on="click: items[1].items[0].title = 'hi'">2.1</button>
  16. <button id="b1-1" v-on="click: items[1].items[1].title = 'hi'">2.2</button>
  17. </div>
  18. <script src="../../../dist/vue.js"></script>
  19. <script>
  20. Vue.config({debug:true})
  21. var items = [
  22. { title: 0, items: [{title:0}, {title:1}] },
  23. { title: 1, items: [{title:0}, {title:1}] }
  24. ]
  25. new Vue({
  26. el: '#test',
  27. data: {
  28. items: items
  29. }
  30. })
  31. </script>