这个vue的生命周期怎么解释？

Question

原文末尾问题 文末有github链接

问题(待解决)： 在vue的编码规范中有如下声明：

传递过于复杂的对象使得我们不能够清楚的知道哪些属性或方法被自定义组件使用，这使得代码难以重构和维护。

所以， 我考虑Table.vue传递李明的字符串， edit()方法修改如下：

edit(index) {

   this.selectedList = JSON.stringify(this.students[index]);

   this.toggleEdit();

}

然后再在Crud.vue中解析成对象， 修改如下:

updated() {

  this.list = JSON.parse(this.modifyList);

}

此时点击一行数据进行编辑， 浏览器会进入死循环， 卡死。 解析放到beforeupdate

beforeupdate() {

  this.list = JSON.parse(this.modifyList);

}

点击编辑， 循坏100来此报错：

哪位大神能详尽的解释一下么？ updated状态下进行解析生成新对象， 组件Crud.vue又会进入beforeUpdate=> updated状态又成新解析的对象， 无限循环直到内存溢出， 那么为什么解析放在updated中回掉浏览器器会直接卡死， 而beforeUpdated中递归会中止并报错？

Answer 1

我最近也遇到了这样的问题，不过是React，不过很类似的吧，我最初的想法是把一些重新格式化或者处理放到子组件中，但是非常容易导致无限循环，这其实本身可能就是一种不健康的方式，我最后的办法还是尽量集中到父组件中，利用props传下去，子组件只做展示渲染。