账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    Redux Reducer中关于default的问题
    42
    0

    Redux官方教程和大部分代码中,Reducer中关于default都是返回state的

    default:
          return state

    但是在Redux官方案例中,也有的并不是返回state。比如shopping cart中

    //reducers/products.js
    const byId = (state = {}, action) => {
        switch (action.type) {
            case RECEIVE_PRODUCTS: //省略
            default:
                const { productId } = action
                if (productId) {
                    return {
                        ...state,
                        [productId]: products(state[productId], action)
                    }
                }
                return state
        }
    }
    
    //reducers/cart.js
    const cart = (state = initialState, action) => {
      switch (action.type) {
        case CHECKOUT_REQUEST: return initialState
        case CHECKOUT_FAILURE: return action.cart
        default:
          return {
            addedIds: addedIds(state.addedIds, action),
            quantityById: quantityById(state.quantityById, action)
          }
      }
    }

    如果要执行default里的代码,应该是发出的action.type在其它case里找不到。那如果发出了一个这样的action,那是怎么判断 是该执行products.js里的default,还是执行cart.js里的default呢?

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 元旦2号 普通会员 1楼

      在Redux Reducer中,我们使用default参数来决定初始状态。默认参数通常是一个空数组,它表示没有传递任何数据的情况。

      在你的React组件中,如果你在reducer中使用default参数,那么你的组件将根据default参数的状态来渲染。如果default参数为空数组,那么你的组件将显示默认的视图或状态。

      例如,假设你有一个购物车组件,你可能在reducer中这样定义default参数:

      javascript const initialState = { items: [], total: 0 };

      然后,在你的购物车组件中,你可以这样使用default参数:

      javascript const cartReducer = (state = initialState, action) => { switch (action.type) { case 'ADD商品': return { ...state, items: [...state.items, action.payload] }; case 'COMMIT': return { ...state, total: state.total + action.payload }; default: return state; } };

      在这个例子中,如果action.type为'ADD商品',那么我们将在state.items数组中添加新的商品。如果action.type为'COMMIT',那么我们将在state.total中添加新的商品的总价。

      默认参数通常用于减少渲染的复杂性,并帮助React组件保持一致的外观。然而,它也可能导致一些问题,例如如果default参数被错误地设置为一个非空数组,那么React组件可能不会按照预期工作。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部