React Redux Typescript APP Store обновлен, но компонент не перерисован

Question

При нажатии кнопки добавления данные добавляются в корзину, но страница не обновляется автоматически после добавления. Если я добавлю ловушку React.useState () и обновлю состояние по нажатию кнопки, то после отправки страница будет перерисована.

Согласно моему пониманию, страница перерисовывается всякий раз, когда обновляется состояние.

Git Hub Link: https://github.com/iam-aki/green-mini-market.git

Answer 1

Это происходит потому, что вы изменяете хранилище избыточности. В вашем коде:

        case CartActionTypes.ADD: {
        let itemExists = state.cart.find(cart => cart.productId === action.product.productId);
        if (itemExists) {
            itemExists.count = itemExists.count + 1;
            return {
                ...state,
                ...state.cart
            };
        } else {
            let cart: ICart = { productId: action.productId, product: action.product, count: 1 };
            state.cart.push(cart);
            return {
                ...state,
                ...state.cart
            };
        }
    }

Переключитесь на

        case CartActionTypes.ADD: {
        let itemExists = state.cart.find(cart => cart.productId === action.product.productId);
        if (itemExists) {
            itemExists.count = itemExists.count + 1;
            return {
                ...state,
                cart: [...state.cart, itemExists]
            };
        } else {
            let cart: ICart = { productId: action.productId, product: action.product, count: 1 };
            return {
                ...state,
                cart: [...state.cart, cart]
            };
        }
    }