常常遇到回显问题?今天告诉你该如何下手

63 阅读2分钟

背景

主包刚刚入职新公司,本着快速上手的原则,向导师申请了一些问题单去解决。

就好比上学时带着问题去看书一样,带着问题去看代码也自然是自己琢磨代码逻辑是要更有收获的。

在解决问题的过程中,遇到一些常见的回显问题,于是想着能不能总结一下,就写下这篇回显问题速查手册,供掘友们参考~ (本来还有一些问题单案例,不方便展示)

回显问题

回显问题的本质就是状态(state或store)和渲染不一致,导致的原因有很多,比如无效修改state,ajax请求错误未提示客户等等。

排查顺序

  1. 首先确认数据源,判断是否是请求返回

  2. 如果是,则排查接口问题

    1. 请求是否成功发送
    2. 成功发送后检查接口入参是否正确
    3. 接口状态码是否正常
    4. 返回数据结构是否符合预期
  3. 接口数据拿到之后,追踪数据处理流程

    1. 拿到数据后的处理逻辑是否正确
    2. 处理后的数据是否正确更新到状态
  4. 检查组件渲染

    1. 数据绑定语法是否正确
    2. 传入的引用数据是否是为副本
    3. 条件渲染逻辑是否正常
  5. 检查其他副作用

    1. 有没有异步操作时序的问题(setTimeout,同步代码先执行)
    2. 某些操作后应该执行的副作用逻辑是否符合预期(凭证修改本币同步修改现金流量数据)
    3. 状态是否被其他逻辑覆盖,比较简单的排查办法就是文件或者全局搜索该变量
  6. 如果不是接口返回,而是本地计算

    1. 排查是否有缓存,更新时未更新缓存
    2. 计算逻辑是否正常,输入输出是否符合预期
  7. 如果是用户输入

    1. 排查监听函数是否正确修改state