React+Next.js报错setShowCatMenu不是函数问题求助与修复

问题场景 #

在Menu组件中调用通过props传入的setShowCatMenu函数时，触发错误：Error!: setShowCatMenu is not a function。

问题根源 #

Header组件中使用useState钩子时，错误采用了对象解构的方式获取状态及状态更新函数，但useState的返回值是一个数组，而非对象，因此无法通过对象解构正确拿到setShowCatMenu这个状态更新函数，导致传递给Menu组件的是undefined，调用时就会触发函数不存在的错误。

修复方案 #

将所有useState的对象解构写法改为数组解构，确保正确获取状态更新函数：

错误代码（Header组件）

const { showCatMenu, setShowCatMenu } = useState(false);

修复后代码

const [showCatMenu, setShowCatMenu] = useState(false);

注意事项 #

项目中其他类似的useState使用（如mobileMenu、show、lastScrollY等）也需要同步修改为数组解构，避免出现相同类型的错误。修改后，setShowCatMenu就能正确作为函数传递给Menu组件，报错问题即可解决。

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