el-table type=“expand“ @expand-change=“ “ 事件获取数据 dom渲染不显示

问题的形成原因：

1.在el-table中添加 type=“expand” 二级列表
2.二级列表数据是由 @expand-change=" " 事件 请求api获取
3.把获取的数据动态添加到一级列表的数据中
4.导致数据结构 深层次 嵌套 vue数据没有及时回显

* 详解

我们知道在vue中，数据的绑定都不用我们操心，例如在data中有一个msg的变量，你修改它，那么在页面上，msg的内容就会自动发生变化。但是如果对于一个复杂的对象，例如一个对象数组，你直接去给数组上某一个元素增加属性，或者直接把数组的length变成0，vue就无法知道发生了改变。
// 一级列表 渲染数据是数组 array // 二级列表 渲染数据是根据一级数据的当前列表的id请求api获取的 数据结构也是数组
arrayChildren // 将获取到的arrayChildren 根据id判断 动态添加到 相应的一级列表中 //
例如一个对象数组，你直接去给数组上某一个元素增加属性，或者直接把数组的length变成0，vue就无法知道发生了改变。 。。。 // v-if=
“update ” 配合 this.$nextTick(() => {} 强制刷新dom结构 <el-table v-if= 'update '>
</el-table > 二级列表 this.array.forEach((item, key) => { if (item.id == row.id) {
this.array[key].arrayChildren1 = arrayChildren1 this.array[key].arrayChildren2 =
arrayChildren2} }) this.update = false this.$nextTick(() => { this.update =
true })

• « 上一篇：离散数学(Closure operation)闭包运算全解
• » 下一篇：Nacos配置使用（阿里云版）