ウェブサイト検索

Reselect Redux 関数の戻り値の TypeScript 型は?


ReduxのReselectにおけるcreateSelector関数の戻り値の型を定義することは可能ですか?

公式ドキュメントからはこれを理解できませんでした: https://github.com/reduxjs/reselect#q-are-there-typescript-typings

このチートシートも次のことは提供していないようです: https://github.com/piotrwitek/react-redux-typescript-guide#selectors-with-reselect

import { createSelector } from 'reselect';

import { TodosState } from './reducer';

export const getTodos = (state: TodosState) => state.todos;

export const getTodosFilter = (state: TodosState) => state.todosFilter;

export const getFilteredTodos = createSelector(getTodos, getTodosFilter, (todos, todosFilter) => {
  switch (todosFilter) {
    case 'completed':
      return todos.filter(t => t.completed);
    case 'active':
      return todos.filter(t => !t.completed);

    default:
      return todos;
  }
});

もし私が getFilteredTodos の返り値がこのようなものであることを知っているなら:

type Return = {
  text: string;
  completed: boolean;
}[]

それではこれを定義してもいいですか?

回答 #1

戻り値は次のように定義できます:

export const getFilteredTodos = createSelector(getTodos, getTodosFilter, (todos, todosFilter) : { text: string; completed: boolean; }[] => {
  switch (todosFilter) {
    case 'completed':
      return todos.filter(t => t.completed);
    case 'active':
      return todos.filter(t => !t.completed);

    default:
      return todos;
  }
});