Redux reducer嵌套状态访问问题：如何正确合并嵌套状态？

数据老陈

2026-5-15

解决Redux Reducer嵌套状态访问的TypeError问题

我来帮你拆解下问题根源，再给出可行的解决方案：

第一种写法state.coins.action.coin.name本身语法就错了，动态属性不能用点运算符访问，必须用方括号[]来取值，所以这种写法肯定会触发报错。
第二种写法的问题在于，当某个币种是第一次被处理时，state.coins里还没有[action.coin.name]这个键，此时state.coins[action.coin.name]是undefined，直接展开undefined就会抛出TypeError。

正确的写法

你需要先判断目标嵌套状态是否存在，如果不存在就用空对象兜底，这样展开操作就不会出错了。这里有两种常用的靠谱方式：

方式1：逻辑或运算符（||）兜底

case GET_COIN_PRICE:
  return {
    ...state,
    coins: {
      ...state.coins,
      [action.coin.name]: {
        // 若该币种还未在state中存在，就用空对象代替，避免展开undefined报错
        ...(state.coins[action.coin.name] || {}),
        bithumbPrice: action.bithumbPrice,
        upbitPrice: action.upbitPrice,
        bittrexPrice: action.bittrexPrice
      }
    },
  }

方式2：可选链+空值合并运算符（??）兜底（ES2020+支持）

这种方式更严谨，因为如果state.coins[action.coin.name]是null或者其他合法的假值状态，??只会在值为undefined或null时才返回兜底的空对象：

case GET_COIN_PRICE:
  return {
    ...state,
    coins: {
      ...state.coins,
      [action.coin.name]: {
        ...(state.coins[action.coin.name] ?? {}),
        bithumbPrice: action.bithumbPrice,
        upbitPrice: action.upbitPrice,
        bittrexPrice: action.bittrexPrice
      }
    },
  }