vue中渲染数据可能有一个无限更新循环--You may have an infinite update loop in a component render function.

今天在在工作中碰到个问题，在此记录下。

今天在接接口数据时发现数据搞反了，于是想着把数据倒叙一下

<row-list
v-if="dataList.rules"
:canSelect="!isClose"
:dataList="dataList.rules[0].subLotteryRule[0].subLotteryRule.reverse()"
@selectRow="selectRow"></row-list>

结果报了个错

找了好久发现问题就在于reverse()这个方法

vue的响应式原理中对于数组的更新检测包含了一组观察数组的编译方法

push()

pop()

shift()

unshift()

splice()

sort()

reverse()

而我在呈现的数据中调用了reverse()这个方法，这样就会导致无限的更新循环。

解决办法也很简单，可以在vue实例的数据对象赋值之前调用reverse()就可以了

学习笔记，如有不足请多指教！