Reactjs 如何更改功能组件中的上下文值？

我有一个名为

StatusContext

的上下文，如下所示：

export const statusCtxInit = {
    open: false,
    toggleOpen() {
        this.open = !this.open;
    }
};

const StatusContext = React.createContext(statusCtxInit);
export default StatusContext

整个应用程序正在与提供商包装：

// ...
<StatusContext.Provider value={statusCtxInit}>
// ...

另一方面，我还想通过调用

toggleOpen

来更改上下文，但它并没有按我所希望的那样工作。实际上，该值会更改，但不会影响

MyComp

我做错了什么？我该怎么办？

const statusContext=React.createContext（）
const{Provider}=statusContext
//自定义提供者
export const StatusProvider=（{children}）=>{
常量[isOpen，setOpen]=React.useState（false）
常量切换=（）=>setOpen（v=>！v）
返回(
{儿童}
)
}
//定制挂钩
导出常量useStatus=（）=>useContext（StatusContext）
//用法
函数mycop（）{
const status=useStatus（）
返回(
{status.isOpen
“是开着的`
：`它关闭了`}
status.toggle（）}>
切换
)
}
导出默认mycop

statusCtxInit

不是反应状态component@DennisVash我不知道你写了什么。是的，这只是一个简单的问题object@gaditzkhori我不知道你写了什么。是的，它只是一个简单的物体

function MyComp() {
    const status = useContext(StatusContext);
    return (
        <div>
            {status.open
                ? `It's Open`
                : `It's Closed`}

            <button onClick={() => status.toggleOpen()}>
                Toggle
            </button>
        </div>
    )
}

export default MyComp