AJAX请求返回数据报Data object is not iterable，如何匹配mock格式实现迭代？

报错有两个核心原因：

• jQuery AJAX的参数写错了：正确的参数名是驼峰格式dataType，且对应值应为json而非application/json，错误写法导致jQuery没有自动解析返回内容为JSON对象
• 后端返回结构嵌套了两层序列化内容：外层返回的data字段值还是二次序列化的JSON字符串，不是你mock数据对应的FeatureCollection对象

仅需调整前端AJAX部分的代码即可：

1. 修正AJAX的dataType参数配置
2. 回调中先取外层返回的data字段，再用JSON.parse解析为对象，即可和你的mock格式完全匹配

jQuery.ajax({
    type: 'GET',
    url: "<?php echo JURI::base() . "index.php?option=com_ajax&module=hunter_maps_dev&method=getStoresByZip&zip="?>"  + zip + "&format=json",
    // 修正参数写法
    dataType : "json",
    success:function(res){
        console.log('success');
        // 解析内层嵌套的JSON字符串为对象
        const stores = JSON.parse(res.data);
        console.log(stores);
        buildLocationList(stores);
    }
})

你原有buildLocationList函数不需要做任何修改。

当前接口返回的坐标是字符串格式["-104.9981929","39.7164275"]，和mock数据的数字格式不一致，如果后续要做地图渲染、距离计算等操作，可以额外加一步坐标格式转换：

const stores = JSON.parse(res.data);
stores.features.forEach(feature => {
  feature.geometry.coordinates = feature.geometry.coordinates.map(Number)
})

内容的提问来源于stack exchange，提问作者Geoff_S