vue2_data过深

当data深度过深，且夹带异步请求时

1，首先会遇见数据加载顺序不正确

 解决：采用promisr 配合异步请求，待请求完成之后将数据push到已定变量中接收，利用链式调用特性（以下函数自行调试）

async fun() {
        // 尽量使用if循环
      for (let i = 0; i < this.Data.length; i++) {
        try {
          const params = {
            id: id,
          };
          const response = await getAxiosData(params);
          this.saveData.push(response.data.data.doc);
        } catch (error) {
          console.error("Error:", error);
        }
      }
    }

缺点，加载速度相对较慢，视觉上会有卡顿感。（也期待大神指导）

2，html渲染报错，常见错误如图

报错类型1

报错类型2

根据这张图，问题就显而易见了

此时数据可以渲染，但控制台报错

问题解析：1，排查data深度是否过深，2，排查是否是在渲染之前能够获取到数据

解决方案：

1，使用v-if或v-for在html中层层判断并加载数据（你的可能是数组，或者数组对象又或者。。。）

        不推荐：原因==》会改变html结构

2，将判断条件整理为函数，返回相应的值，在页面中使用

        推荐：好使！

fun(index, type) {
      if (this.Array.length) {
        for (let k = 0; k < this.Array.length; k++) {
          if (k == index) {
            for (var i = 0; i < this.Array[index].length; i++) {
              if (i == 0) {
                return this.Array[index][i][type];//对象可以用[]取值!!!!!!!
              }
            }
          }
        }
      }
    },

谨此记录

——感谢我亲爱的莫！好兄弟，看到这篇文章截图v我！