一 初始代碼
1.mock創(chuàng)建隨機數(shù)據(jù)

2.調(diào)用mock數(shù)據(jù)并賦值給vue data中的list?

3.html

二 發(fā)現(xiàn)問題
1. 發(fā)現(xiàn)mock生成的數(shù)據(jù)是隨機的 數(shù)字大小沒有排序
2 .在 vue filter中調(diào)用sort 對呈現(xiàn)的數(shù)據(jù)進行處理

3. 報錯:
vue中渲染數(shù)據(jù)可能有一個無限更新循環(huán)--You may have an infinite update loop in a component render function.
4. 問題原因:
vue的響應(yīng)式原理中對于數(shù)組的更新檢測包含了一組觀察數(shù)組的編譯方法
push()
pop()
shift()
unshift()
splice()
sort()
reverse()
而在filter中調(diào)用以上的方法就會導(dǎo)致無限的更新循環(huán)
5.解決方法:
?在獲取數(shù)據(jù) 渲染呈現(xiàn)之前調(diào)用sort

三 問題核心
vue的響應(yīng)式原理