js 循环变量时报类型错误

错误

Uncaught (in promise) TypeError: Invalid attempt to spread non-iterable instance. In order to be iterable, non-array objects must have a Symbol.iterator method.

TypeError：尝试传播不可迭代的实例是无效的。为了可迭代，非数组对象必须具有 Symbol.Iterator 方法。

解决

仔细观察要解析或者返回的数据发现格式如下

{
  "list": {
    "0": {
      "a": 1,
      "b": 2
    },
    "1": {
      "a": 1,
      "b": 2
    },
    "5": {
      "a": 1,
      "b": 2
    }
  }
}

很明显是数据 key 值有异常导致，让后端返回正常的数组即可。

原因

这次的原因是后端的锅，由于数据库数据缺失，导致数据未按预期排列顺序返回。当数据库返回数据不连续时，后端 PHP 处理时出现的问题。复现代码如下：

$arr = [
    'list'=>[
        0=>['a'=>1, 'b'=>2,],
        1=>['a'=>1, 'b'=>2,],
        5=>['a'=>1, 'b'=>2,],
    ],
];

echo json_encode($arr);

处理方式，使用函数 array_values() 对获取的二维数组 list 重新进行 key 值排序后再输出给前端