React-Native中使用对象控制Switch组件时状态无法正常更新问题

问题根因 #

1. 初始化时机错误：你当前初始化seleccion的useEffect依赖为空数组，仅会在组件首次挂载时执行一次。如果planes是异步接口返回、或是父组件延迟传入的参数，首次执行useEffect时planes为空，生成的seleccion是没有对应plan.nombre键的空对象。后续卡片渲染时seleccion[plan.nombre]读取结果为undefined，Switch组件接收到非布尔值会默认视为false，这也是你在渲染层执行toString(seleccion[plan.nombre])得到[object Undefined]的直接原因。
2. 状态更新存在闭包陷阱：你当前在toggleSwitch中直接展开当前作用域下的seleccion更新状态，若作用域缓存了旧的seleccion快照，会导致每次更新都基于旧状态覆盖，状态更新不符合预期。

修复方案 #

1. 修正初始化依赖，确保planes加载完成后再生成初始状态：

useEffect(() => {
  if (!planes || !Array.isArray(planes)) return
  const lista = {}
  planes.forEach(plan => {
    lista[plan.nombre] = false
  })
  setSeleccion(lista)
// 把planes加入依赖数组，planes加载完成后自动重新初始化
}, [planes]);

2. 切换函数改用函数式更新，规避闭包问题，永远基于最新状态修改：

const toggleSwitch = (val, plan) => {
  setSeleccion(prev => ({...prev, [plan]: val}))
};

3. 渲染Switch时对值做布尔转换兜底，避免undefined传入组件：

<Switch
  offTrackColor="indigo.100"
  onTrackColor="indigo.300"
  onThumbColor="coolgray.500"
  offThumbColor="indigo.50"
  size="lg"
  onToggle={(val) => toggleSwitch(val, plan.nombre)}
  {/* 用!!强制转布尔值，兜底处理不存在的key */}
  value={!!seleccion[plan.nombre]}
/>

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