reactjs - 如何使用 Typescript 在无状态组件上设置 navigationOptions

Question

我有一个像这样的 react 组件

const Example = () => (<View>...</View>);

使用 react-navigation 我通常会通过说来应用导航选项

Example.navigationOptions = { options };

使用 typescript 时出现错误

[ts] 类型“(props: Props) => Element”上不存在属性“navigationOptions”。

我该如何解决这个问题？

我试着写一个界面

interface ExampleWithNavigationOptions extends Element {
    navigationOptions?;
}

但没有运气。

Answer 1

您可以使用以下内容:

import {
  NavigationScreenProps,
  NavigationScreenComponent
} from 'react-navigation'

interface Props extends NavigationScreenProps {
  // ... other props
}

const MyScreen: NavigationScreenComponent<Props> = ({ navigation }) => {
  // ... your component
}

MyScreen.navigationOptions = {
  // ... your navigation options
}

export default MyScreen