hvordan bruke selektorer i en Redux-app med TypeScript?
Jeg prøver å bruke selectors fra reselect-biblioteket i min Redux-app.
min selektorfiler ser slik ut:
import { createSelector } from 'reselect'
const postsSelectors = state => state.global.posts.allPostse;
export const getPosts = createSelector(
[ postsSelectors ],
(posts) => posts
);
og så prøver jeg å bruke det i komponenten min, slik:
const mapStateToProps = (state) => ({
posts: getPosts(state),
});
Når jeg prøver å kompilere alt dette, får jeg denne feilen:
Jeg gjetter at med hvordan jeg erklærer typer for props, som for øyeblikket ser slik ut:
interface Props{
posts(state: any): any
loadStories(): void;
};
Hjelp meg med å løse dette problemet. Takk på forhånd.
Svar #1
Et eksempel med flere typer:
- Beskriv typer
type TPostData = {
type: string;
};
type TPostsState = TPostData[];
type TState = {
posts: TPostsState;
};
- Opprett velgere
// get all posts
export const selectPosts = (state: TState): TPostsState => state.posts;
// get new posts
export const selectNewPosts = createSelector<
TState,
TPostsState,
TPostData[]>(
selectPosts,
(posts) => posts.filter(({ type }) => type === 'new'),
);
Resultat: Du har fått alle innlegg med typeparameter 'new'.
Svar #2
TypeScript forventer ikke et array for det første argumentet. Bare send inn dine selektorfunksjoner som argumenter til createSelector, som i
export const getPosts = createSelector(
postsSelectors,
(posts) => posts
);
