舉個案例：循環data中的list的值在div中，並顯示相應的index值。
關於數組的循環：
//顯示效果如下圖：
//一般的列表渲染最好帶一個key值，要把key值設置為唯一值的話，可以選擇index。但在頻繁操作DOM元素相對應的數據的時候，它還是有點浪費性能，可能讓Vue沒法充分復用DOM節點，所以不太建議用index來做key值
//所以一般的項目中的后端會傳遞過來一些數據，這些數據可以把它作為key值來使用（一般會攜帶一個后端或數據庫相關的一個唯一的數據條目標識符，例如：id）
//修改如下圖所示：
//把key值設置成（item.id）既是唯一的，同時又不是index下標，就能保證key值的使用最終是正確的，性能上最高
//在使用key值的時候，每個循環項最好帶一個key值，提高性能；為了讓key值達到最優效果，就要把key設為唯一的，盡量不用index下標作為key值
===============================================================
接下來講解一下：如何動態的往列表里添加內容
//如上，運用數組中的push()方法，當往數組里添加內容的時候頁面會自動的響應出增加的內容
//如上，當直接用下標的方法來添加數組內容的時候，頁面上並沒有把添加的數據顯示出來。然后在控制台中輸入vm.list來查看數據的時候，發現里面是有數據的添加的，只是沒有顯示在頁面上而已
//總結：當我們去嘗試更改數組里面的內容的時候，不能直接通過下標的形式來改變數組；只能通過Vue提供的幾個數組變異方法來操作數組，才能夠實現數據變化，頁面也跟着變化
Vue中一共提供了7種數組的變異方法：pop（把數組最后一項刪除掉）、push（往數組里增加一條）、shift（刪除數組里的第一項）、unshif（往數組里的第一項增加內容）、splice（數組的截取/操作方法）、sort（對數組進行排序）、reverse（對數組進行取反）
//接下來講解一下：把頁面上的數據George修改為Rose
方法一：改變數組的內容
//用splice()的方法來改變Gerorge，表達式中寫入(1,1,{id:'001',text:'Rose'})即可。 表達式中第一個1表示數組中的第一項(即list[1])，第二個1表示刪除一條內容，{id:'001',text:'Rose'}表示往里增加一條內容
方法二：改變數組中的數據引用
//改變數據上新的引用，直接把數據的第二項（即list[1]的text直接修改）
若要在div外再循環一個span標簽，可以用template方法來實現效果，代碼如下圖：
//顯示效果如下： div和span標簽都循環了
//用template模板占位符可以去包裹一些元素，但是在循環的過程中，他並不會真正的被渲染到頁面上
==================================================
關於對象的循環：
//顯示效果如下：
//如上，key值指向的就是這個對象中的鍵名（例：name），而item值指向的就是這個對象的鍵值（例：‘George’），index值指向的就是它在對象中的第幾個位置
===============================================================
接下來講解一下：如何動態的往列表里添加內容
//如上，當改userInfo的name值時，數據變了，頁面也跟着改變了。而當你添加一個新的數據時，數據有發生變化，但是頁面上並沒有顯示出來效果。所以說，當在遍歷對象的時候，直接動態的往對象里面加值是不好用的。但是如果硬要是往里面添加的話呢，就類似於數組一樣，直接把對象的引用賦值進去改變就行了（會比較麻煩）
//操作如下：
==================================================
對象中：
還可以采取另外一種方法來實現： 即Vue.set()方法！
//在控制台中用set方法也可以實現在對象中添加數據。如：Vue.set(vm.userInfo,'address','Beijing')，這段代碼的編寫，就可以實現在頁面和對象中添加一個新的數據address 顯示效果如下圖：
//然而，Vue.set()方法不僅可以這樣來使用，還可以用Vue實例的方法來使用 （它既是一個Vue中的全局方法，同時也是Vue中的實例方法）
//用vm.$set(vm.userInfo,'address','Beijing')的實例方法也可以照樣實現如上效果，演示效果如下圖：
===============================================================
數組中：
也可以采取另外一種方法來實現： 即Vue.set()方法！
稍微更改一下之前的代碼，簡化一下：
然后在控制台上進行set方法的使用，如下圖操作：
//如上，可以發現數組的set方法也是像對象的使用一樣，而且同樣都可以達到效果！其中（vm.userInfo,1,5）的“1”指的是數組的第二項（即userInfo[1]），“5”指的是需要修改的內容。