小编jms*_*pps的帖子

假设我有一个用于检查用户是否登录的基本设置：

import { createContext } from "react";
const UserContext = createContext<string | null>(null)
export default UserContext

在我的 App.tsx 中，我想创建一个 useState 挂钩，以便我可以管理整个应用程序中的上下文状态：

//Context
const [context, setContext] = useState<string | null>(null)

  <UserContext.Provider value={{context, setContext}}>

    <Routes>

      <Route path="/" element={<Home/>}/> 
      <Route path="/login" element={<Login/>}/> 
      <Route path="/register" element={<Register/>}/> 
      <Route path="/admin" element={<Admin/>}></Route>

    </Routes>  

  </UserContext.Provider>

因此，据我所知，我只需要登录用户的名称，或者如果我想拒绝访问某些页面，则将上下文的状态设置为空。现在的问题是打字稿在这里对我大喊大叫，特别是在 Provider 的值中：

Type '{ context: string | null; setContext: 
React.Dispatch<React.SetStateAction<string | null>>; }' is not assignable to type 'string'.ts(2322)

我可以强制转换该值，如下所示：

value={{context, setContext} as any}

但这似乎并不是一个特别优雅的“打字”解决方案。

任何帮助表示赞赏！