reactjs - Egenskapen 'dispatch' mangler i typefeil når roten butikk sendes til rotkomponent
Jeg begynner med TypeScript og Redux, og jeg støtte på følgende feil når jeg startet opp applikasjonen min.
Type '{ store: Store<IRootState>; }' is not assignable to type
'IntrinsicAttributes & Store<IRootState> & { children?: ReactNode; }'.
Type '{ store: Store<IRootState>; }' is not assignable to type 'Store<IRootState>'.
Property 'dispatch' is missing in type '{ store: Store<IRootState>; }'.
Jeg har følgende rotkomponent som rendres:
const Root: React.SFC<Store<IRootState>> = (store) => (
<Provider store={store}>
<Router>
<Route exact={true} path="/" component={App} />
</Router>
</Provider>
);
ReactDOM.render(
<Root store={RootStore}/>,
//......~~~~~~~~~~~~~~~~~
document.getElementById('root') as HTMLElement
);
Feilen oppstår i linjenstore={RootStore}. Her er RootStore resultatet av å kalle createStore på min root-reducer og initialtilstand. Typen til initialtilstanden er IRootState som er ganske enkel:
export interface IRootState {
navBar: INavBarState;
}
og Root-butikken eksporteres som følger:
const RootStore = createStore(rootReducer, initialState);
export default RootStore;
Hvis jeg forstår dette riktig (noe jeg er sikker på at jeg ikke gjør), skjer feilen fordi parameteren dispatch ikke er til stede i returverdien fra createStore. Men siden dette er en biblioteksfunksjon, har jeg en tendens til å tro at jeg overser noe ganske åpenbart her.
Svar #1
Problemet er at for Root erklærer du props som et objekt av typen Store<IRootState>, i stedet for et objekt med en store-egenskap av typen Store<IRootState>. Derfor oppstår feilen '{ store: Store<IRootState>; }' kan ikke tildeles typen 'Store<IRootState>'
Å pakke inn typeparameteren og store-parameteren bør gjøre susen:
const Root: React.SFC<{store: Store<IRootState>}> = ({store}) => (
