我是React上下文和TypeScript的新手,我正在尝试编写上下文来打开和关闭侧边栏。
import React, { createContext, useContext, ReactNode, SetStateAction, Dispatch } from "react";
interface StateContextType {
activeMenu: boolean
setActiveMenu: Dispatch<SetStateAction<boolean>>;
}
export const StateContext = createContext<StateContextType>({
activeMenu: true,
setActiveMenu: () => {}
});
type ContextProviderProps = {
children?: ReactNode
}
export const ContextProvider = ({ children }: ContextProviderProps) => {
return (
<StateContext.Provider
value={{ activeMenu: true, setActiveMenu: () => { } }}
>
{children}
</StateContext.Provider>
)
}
export const useStateContext = () => useContext(StateContext)
当我尝试在我的应用程序中使用上下文时,布尔值“activeMenu”工作正常,这意味着侧边栏基于其值显示。因为我将其默认值设置为true,所以侧边栏显示,当我从上下文提供程序手动更改时,它会关闭侧边栏,但这里的问题是setter函数“setActiveMenu”根本不起作用。正如我所说的,我对react上下文和typescript都是新手,在我的控制台中没有显示错误,我也不知道为什么会这样
1条答案
按热度按时间pwuypxnk1#
你没有在任何地方存储你的状态,你的上下文需要一些支持。