reactjs - Tipul 'unknown[]' nu are următoarele proprietăți din tipul 'InitialState'
Încercând să înțelegi cum să transmiți tipuri către value?
<Context.Provider value={[state, dispatch]}>{children}
</Context.Provider>
Tipul 'unknown[]' nu are următoarele proprietăți din tipul 'InitialState': navigateTo, user, avatar, dashBoardSelectedMenuItemts(2739) index.d.ts(338, 9): Tipul așteptat provine de la proprietatea 'value' care este declarată aici pe tipul 'IntrinsicAttributes & ProviderProps' (atribut JSX) React.ProviderProps.value: InitialState
import React, { createContext } from "react";
import Reducer from "./reducer";
interface InitialState {
navigateTo: string;
user: string;
avatar: string;
dashBoardSelectedMenuItem: string;
}
const initialState: InitialState = {
navigateTo: "dashboard",
user: null,
avatar: null,
dashBoardSelectedMenuItem: "dashboard",
};
export const Context = createContext<InitialState>(initialState);
const Store = ({ children }) => {
const [state, dispatch] = React.useReducer<any>(Reducer, initialState);
return (
<Context.Provider value={[state, dispatch]}>{children}</Context.Provider>
);
};
export default Store;
Mulțumesc pentru că te-ai uitat.
Răspuns #1
Încercă asta
import React, { createContext } from "react";
import Reducer from "./reducer";
export default function App() {
return (
<div className="App">
<h1>Hello CodeSandbox</h1>
<h2>Start editing to see some magic happen!</h2>
</div>
);
}
interface InitialState {
navigateTo: string;
user: string | null;
avatar: string | null;
dashBoardSelectedMenuItem: string;
}
const initialState: InitialState = {
navigateTo: "dashboard",
user: null,
avatar: null,
dashBoardSelectedMenuItem: "dashboard"
};
export const Context = createContext<[InitialState, React.Dispatch<any>]>([
initialState,
() => {}
]);
const Store = ({ children }) => {
const [state, dispatch] = React.useReducer(Reducer, initialState);
return (
<Context.Provider value={[state, dispatch]}>{children}</Context.Provider>
);
};
export default Store;
În reducerul tău adaugă informațiile despre tip pentru stare așa cum urmează
export const Reducer = (state: InitialState, action:any): InitialState => {
switch (action.type) {
...
...
}
}
Răspuns #2
Lasă-mă să încerc să te ajut.
Aici, așa cum ați definit tipul de utilizator și avatar în starea inițială ca șir de caractere, ar trebui să transmiteți doar șiruri de caractere ca valoare.
Poate că transmiți null în loc de un șir gol "" ar putea rezolva problema de tip.
typeof null este Object.
const initialState: InitialState = { navigateTo: "dashboard", user: "", avatar: "", dashBoardSelectedMenuItem: "dashboard", };Puteți vizita acest link pentru o problemă similară Utilizarea contextului React cu hook-urile React în TypeScript
