Text和TouchableOpacity样式类型注释

Question

我正在尝试使用Flow键入注释我的React Native项目，但是我无法找到 <script type="text/javascript"> var cjssor=0; var ele; var ejssor=["jssor_1","jssor_2","jssor_3","jssor_4"]; var`ljssor=document.getElementById("txt") .getElementsByClassName("jssor").length;` function next(n) { cjssor+=1; if(cjssor>=ljssor) { cjssor=0; } ele=document.getElementById("txt").innerHTML=ejssor[cjssor]; $(document).ready(function() { var jssor_1_slider = new $JssorSlider$(ele); }); } function previous(m){ cjssor-=1; ctc=document.getElementById("kk").innerHTML=ejssor[cjssor]; $(document).ready(function() { var jssor_1_slider = new $JssorSlider$(ctc); }); } </script> 和Text元素的类型定义，因此我可以引用他们的TouchableOpacity道具类型定义。如何导入和/或引用这些元素的类型定义？

以下代码：

style

Answer 1

定义StyleSheet类型的方法有很多种。

1。 react-native 通用方式

来自 react-native 库的参考，

<强> SwipeableQuickActionButton.js

import { View } from 'react-native';

type Prop = {
    style?: ?View.propTypes.style,
}

2。 react-navigation 通用方式

来自 react-navigation 库的参考，

<强> TypeDefinition.js

export type Style =
  | { [key: string]: any }
  | number
  | false
  | null
  | void
  | Array<Style>;

如果您已安装react-navigation，请从以下位置导入：

import type { Style } from 'react-navigation/src/TypeDefinition';

type Prop = {
    style?: Style,
}

或者您仍然可以通过在自己的文件中定义来使用它。

3。为Style和<Text />

制作<TouchableOpacity />类型

这将是艰难的方式 - 尽管可行，但看看是否值得这么麻烦。

以<Picker />为参考，为<Text />定义itemStyle，如下所示，与每个选择器项目的文字样式相对应。

var StyleSheetPropType = require('StyleSheetPropType');
var TextStylePropTypes = require('TextStylePropTypes');
var TextStyle = StyleSheetPropType(TextStylePropTypes);

type Prop = {
    itemStyle: TextStyle
}

要在您自己的库中使用它，请从以下位置导入：

import TextStylePropTypes from 'react-native/Libraries/Text/TextStylePropTypes';
import StyleSheetPropType from 'react-native/Libraries/StyleSheet/StyleSheetPropType';

let TextStyle = StyleSheetPropType(TextStylePropTypes);

type Prop = {
    style?: ?TextStyle,
}