组件加载的过程中，数据与视图无法同时呈现的问题

已经四点了，按捺住忐忑不安的心情，写篇小感悟。

这次遇到的问题是组件的数据更新之后，上面的视图无法跟着同时更新。分析的原因是在进行数据更新的时候，组件没有再次进行加载。很简单的一个问题。提出的想法是，在进行循环的时候，将for放到最底层的数组。

等待解决后个更新，貌似有一堆需要解决的更新。

然后数据需要重新定义了……再会！！！！！！！！

这里更新一下：

使用的是，Object.assign()函数，MDN上的解释如下：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

这里是采取了copy一下数据的措施，等于说是把数据又在内存上给了一个新的位置。

favGroupData () {

return this.typesGroupData.map(item=> Object.assign({},item, {

list: this.favViewList.filter(fav=> fav.groupId ===item.id)

}))

}

然后是在

watch: {

favGroupData () {

this.$forceUpdate()

}

},

进行数据的强制更新。forceUpdate()函数，有人这样解释：forceUpdate就是重新render。有些变量不在state上，但是你又想达到这个变量更新的时候，刷新render；或者state里的某个变量层次太深，更新的时候没有自动触发render。这些时候都可以手动调用forceUpdate自动触发render。所以建议使用immutable来操作state，redux等flux架构来管理state。

在vue里面，就是在watch里面监测。

这样完成了数据的更新。