Как во Flow использовать дженерики внутри объекта React компонента?

Question

[Андрей]

Код:

/* @flow */
import * as React from 'react';

type Props<T> = {
    items: Array<T>
};
type State<T> = {
    selectedItems: Array<T>
};

class MyComponent<T> extends React.Component<Props<T>, State<T>> {
    state = {
        selectedItems: []
    };

    renderListItem = ({ item }: { item: T }) => {
        return item;
    };

	render() {
      const {items} = this.props;
      const renderedItems = items.map((item) => this.renderListItem({ item }))
      return null;
	}
}

Ссылка на песочницу.

Описание.
В мой компонент могут быть переданны данные в виде массива объектов T. Часть этих данных компонент сохраняет в стейте так же в виде массива объектов T.
Соответственно я типизирую джереником типы Props и State

Возникает сразу две проблемы:
1) State типизируется T , но это какая-то новая переменная, он не понимает что это за тип, хотя соседний Props понимает, что T - это тип, которым типизирован класс. Как же тогда типизировать одновременно стейт и пропс одним типом?
2) В методе renderListItem, как я пониааю, так же не существует дженерика T, флоу просит типизировать аргумент, но T использовать нельзя. Тогда как его типизировать?

Answer 1

[0xD34F]

state: State<T> = {
  selectedItems: []
}

renderListItem: ({ item: T }) => T = ({ item }) => {
  return item;
}

Comments

[Андрей]

Спасибо, это действительно сработало.
Но, честно говоря, яснее для меня ситуация не стала. Если Вам не сложно, прокомментируйте пожалуйста, почему именно так работает и что не правильно в моем подходе?

[0xD34F]

Андрей, понятия не имею. Никогда flow не пользовался.