使用带有流的反应原生道具类型答案

【问题标题】：Using react native prop type with flow使用带有流的反应原生道具类型
【发布时间】：2017-10-01 18:16:12
【问题描述】：

在 react-native 中为流定义 proptypes 的正确方法是什么？我正在寻找一些指导方针。

// @flow

import React from 'react';
import { TouchableOpacity, Image, StyleSheet } from 'react-native';

type Props = {
  style?: StyleSheet.Styles,
  onPress: () => mixed,
  source: Image.propTypes.source
};

const IconButton = (props: Props) => (
   <TouchableOpacity onPress={props.onPress}>
     <Image style={props.style} source={props.source} />
   </TouchableOpacity>
);

IconButton.defaultProps = {
  style: {}
};

导出默认图标按钮；

我的使用方法是这样的：

<IconButton
    onPress={()=>{}}
    style={this.props.style}
    source={require('./assets/images/circle.png')}
 />

【问题讨论】：

标签： react-native flowtype

【解决方案1】：

使用 flow，您不一定需要 PropTypes - flow 会为您处理输入类型检查。

但是，如果您仍然想要 PropTypes 生成的运行时警告，您可以使用 babel-plugin-flow-react-proptypes Babel 插件根据您的流 Props 类型定义自动生成 PropTypes。

【讨论】：