React Native setState赋值对象报错：features.filter未定义

核心问题 #

你调用setonToggleArea(getAreaValue)后，状态里存的是包含GeoJSON的嵌套对象（比如{ Line1: 实际GeoJSON }），而非直接的GeoJSON对象。后续代码尝试访问它的features属性时自然找不到，导致undefined is not an object(evaluating 'features.filter')错误。

解决步骤 #

1. 修正AreaFiltration函数的返回值 #

确保函数直接返回GeoJSON对象，而非带属性的嵌套结构：

// 错误示例：返回嵌套对象
const AreaFiltration = (selectedKey) => {
  const geoJsonStore = {
    Line1: line1GeoJson,
    madar1: madar1GeoJson
  };
  return { [selectedKey]: geoJsonStore[selectedKey] };
};

// 正确示例：直接返回GeoJSON
const AreaFiltration = (selectedKey) => {
  const geoJsonStore = {
    Line1: line1GeoJson,
    madar1: madar1GeoJson
  };
  return geoJsonStore[selectedKey];
};

2. 若无法修改过滤函数，提取嵌套对象中的GeoJSON #

如果AreaFiltration必须返回嵌套结构，更新状态时要手动取出对应的GeoJSON值：

const selectedValue = "Line1"; // 下拉选中的值
const getAreaValue = AreaFiltration(selectedValue);
// 提取嵌套对象里的GeoJSON
const targetGeoJson = getAreaValue[selectedValue];
setonToggleArea(targetGeoJson);

3. 确保初始状态类型一致 #

初始化onToggleArea时，直接传入Line1对应的GeoJSON对象，而非字符串或其他类型：

const [onToggleArea, setonToggleArea] = useState(line1GeoJson);

4. 增加类型校验避免报错 #

在使用onToggleArea的地方，先检查是否存在features属性，再执行过滤逻辑：

if (onToggleArea?.features) {
  const filteredFeatures = onToggleArea.features.filter(feature => {
    // 你的过滤逻辑
  });
  // 后续处理
}

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