Javascript TypeError:setCartCount不是函数-React-Hooks-Redux

Javascript TypeError:setCartCount不是函数-React-Hooks-Redux,javascript,reactjs,redux,react-redux,react-hooks,Javascript,Reactjs,Redux,React Redux,React Hooks,我正在我的电子商务项目中设置和实施redux,目前我正在尝试设置redux,以便UI更新我创建的BasketBadge,以便在商品添加到购物车时显示购物车中的商品数量 我正在使用redux和react钩子来实现这一点,但是由于某种原因,我在使用钩子时遇到了一个以前没有遇到过的错误:“TypeError:setCartCount不是一个函数” 我在实现addToCart功能时也遇到了类似的错误,但该问题的解决方法不适用于此问题 代码如下> import React, {useState, useE

我正在我的电子商务项目中设置和实施redux,目前我正在尝试设置redux,以便UI更新我创建的BasketBadge,以便在商品添加到购物车时显示购物车中的商品数量

我正在使用redux和react钩子来实现这一点,但是由于某种原因,我在使用钩子时遇到了一个以前没有遇到过的错误:“TypeError:setCartCount不是一个函数”

我在实现addToCart功能时也遇到了类似的错误,但该问题的解决方法不适用于此问题

代码如下>

import React, {useState, useEffect} from 'react';

import 'antd/dist/antd.css';

import { Avatar, Badge } from 'antd';
import { ShoppingCartOutlined, UserOutlined } from '@ant-design/icons';
import { connect } from 'react-redux';

const BasketBadge = ({cart}) => {
    
    const {cartCount, setCartCount} = useState(0);

    useEffect(() => {

        
        let count = 0;
        //loop through cart array
        // counts all of qty of each item added to populate count

        cart.forEach((item) => {
            count += item.qty;
        });
        //once loop is done we set cartCount to new value of count
        setCartCount(count);

    },[cart, cartCount]);

    return(
        <div>
            <span className="avatar-item">
                <Badge count={cartCount}>
                    <Avatar shape="circle" icon={<ShoppingCartOutlined />} />
                </Badge>
            </span>
        </div>
    )
}

const mapStateToProps = (state) => {
    return{
        cart: state.shop.cart,
    }
}

export default connect(mapStateToProps)(BasketBadge);
import React,{useState,useffect}来自“React”;
导入“antd/dist/antd.css”;
从“antd”导入{Avatar,Badge};
从“@ant design/icons”导入{ShoppingCartOutlined,UserOutlined};
从'react redux'导入{connect};
const BasketBadge=({cart})=>{
const{cartCount,setCartCount}=useState(0);
useffect(()=>{
让计数=0;
//循环购物车阵列
//统计添加到填充计数的每个项目的所有数量
cart.forEach((项目)=>{
计数+=项目数量;
});
//循环完成后,我们将cartCount设置为count的新值
setCartCount(计数);
},[cart,cartCount]);
返回(
)
}
常量mapStateToProps=(状态)=>{
返回{
购物车:state.shop.cart,
}
}
导出默认连接(mapStateToProps)(BasketBadge);
而不是:

const {cartCount, setCartCount} = useState(0);
你应该:

const [cartCount, setCartCount] = useState(0);

应该使用语法。它允许我们为通过调用
useState
声明的状态变量指定不同的名称。这些名称不是
useState
API的一部分。

噢,哇,我怎么会错过这个!谢谢你的帮助!