Реакция PropTypes против потока

PropTypes и Flow покрывают подобные вещи, но используют разные подходы. PropTypes может давать вам предупреждения во время выполнения, что может быть полезно для быстрого поиска неверных ответов, поступающих с сервера, и т.д. Однако Flow, похоже, является будущим, и с такими понятиями, как generics, это очень гибкое решение. Также автозаполнение, предлагаемое Nuclide, является большим плюсом для потока.

Теперь мой вопрос - это лучший способ начать новый проект. Или это может быть хорошим решением для использования как Flow, так и PropTypes? Проблема с использованием обоих заключается в том, что вы пишете много дубликатов кода. Это пример приложения для музыкального плеера, которое я написал:

export const PlaylistPropType = PropTypes.shape({
    next: ItemPropTypes,
    current: ItemPropTypes,
    history: PropTypes.arrayOf(ItemPropTypes).isRequired
});

export type Playlist = {
    next: Item,
    current: Item,
    history: Array<Item>
};

Оба определения в основном содержат одну и ту же информацию, и когда тип данных изменяется, оба определения необходимо обновить.

Я нашел этот плагин babel для преобразования объявлений типа в PropTypes, что может быть решением.

Ответ 1

Спустя год после того, как я задал этот вопрос, я хотел дать обновленную информацию о том, как мой опыт с этой проблемой.

Поскольку поток вовлекал много, я начал вводить свою кодовую базу с ним и не добавлял никаких новых определений PropType. До сих пор я думаю, что это хороший путь, потому что, как упоминалось выше, он позволяет не только набирать реквизиты, но и другие части вашего кода. Это очень удобно, например, когда у вас есть копия ваших реквизитов в состоянии, которые могут быть изменены пользователем. Кроме того, автоматическое завершение в среде IDE является удивительным усилением.

Автоматические преобразователи в том или ином направлении не снимались. Поэтому для новых проектов я бы действительно рекомендовал использовать поток над PropTypes (в случае, если вы не хотите дважды печатать).

Ответ 2

Кроме того, что оба относятся к очень широкому полю проверки типов, между ними не очень много сходства.

Поток - это инструмент статического анализа, который использует надмножество языка, позволяя вам добавлять аннотации типов ко всему вашему коду и улавливать весь класс ошибок во время компиляции.

PropTypes - это базовый тип проверки, который был исправлен на React. Он не может проверять ничего, кроме типов реквизита, передаваемого данному компоненту.

Если вам нужен более гибкий метод проверки типов для всего проекта, то Flow/ TypeScript являются подходящими вариантами. Пока вы передаете только аннотированные типы в компоненты, вам не понадобятся PropTypes.

Если вы просто хотите проверить типы опоры, не делайте излишнюю усложнение остальной части вашей кодовой базы и используйте более простой вариант.

Ответ 3

Попробуйте объявить тип реквизита, используя только Flow. Укажите неправильный тип, например номер вместо строки. Вы увидите, что это будет помечено в коде, который использует компонент в вашем потоковом редакторе. Однако это не приведет к сбою тестов, и ваше приложение все равно будет работать.

Теперь добавьте использование React PropTypes с неправильным типом. Это приведет к сбою тестов и будет помечено в консоли браузера при запуске приложения.

Исходя из этого, кажется, что даже если поток используется, следует также указывать PropTypes.

Ответ 4

Я считаю, что пропущенный пункт здесь состоит в том, что Flow является static checker, тогда как PropTypes является проверкой времени выполнения, что означает

Flow может перехватывать ошибки вверх по течению во время кодирования: теоретически может пропустить некоторые ошибки, о которых вы не знаете (если вы не реализовали поток достаточно в своем проекте, например, или в случае глубокого вложенного объекты)
PropTypes поймает их во время тестирования, поэтому он никогда не пропустит