#概要
ReactにてcreateContextを定義した際に、型をセットしたいが型エラーになってしまい上手く行きません。
#コード
const initialObject = { Login: false, UID: '', ExamStatus: '', userID: '', FamilyName: '', GivenName: '', } interface ContextProps { Login:boolean, UID:string, ExamStatus: string, userID: string, FamilyName: string, GivenName: string, } // エラー部分 export const LoginContext = React.createContext<Partial<ContextProps>>([ initialObject, () => {}, ]); export default function LoginContextProvider(props:any){ const [state, setAuth] = React.useState<ContextProps>(()=>{ const userInfo = userPool.getCurrentUser(); if(userInfo){ return({ ...initialObject, // @ts-ignore Login: true, UID: userInfo.username }) }else{ return({ ...initialObject, }) } }) return( <LoginContext.Provider value={[state, setAuth]}> {props.children} </LoginContext.Provider> ) }
#抱えている問題
下記の部分でエラーになっています。
export const LoginContext = React.createContext<Partial<ContextProps>>([ initialObject, () => {}, ]);
おそらくContextPropsという型、定義に問題があるかと思いますが、どのように修正すべきかわからず停滞しています。
interface ContextProps2 { Login:boolean, UID:string, ExamStatus: string, userID: string, FamilyName: string, GivenName: string, }
アドバイス頂けないでしょうか。宜しくお願い致します。
追記
ご指摘の通り、下記のように修正しましたが、2つ目の引数について問題があります。
export const LoginContext = React.createContext<[Partial<ContextProps>, ()=> void]>([ initialObject, () => {}, ]);
2つ目の引数は無名関数として()=>voidを型として設定しましたが、Consumerで使用する際に、「0個の引数が必要だが*個指定されています。」と表示されます。
そこで下記のように引数を指定しましたが、「パラメーターに名前があるが型に名前がない」と表示されます
<[Partial<ContextProps>, (ContextProps)=> void]>
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/08/11 05:31
2020/08/11 05:46