react-native，将参数传递给DrawerNavigator

Question

其实我有这个抽屉导航器

const MyDrawerNavigator = DrawerNavigator(
  {...
    CreditsPage: { screen: CreditsPage },       
    TermsOfUsePage: { screen: TermsOfUsePage },
    LegalNoticePage: { screen: LegalNoticePage },        
  },
  {...}
);

CreditsPage ， TermsOfUsePage ， LegalNoticePage组件仅显示一个webView，因此仅更改源URL。 StaticWebView是我创建的用于分解webView代码的组件，但是我必须复制多个文件内的以下代码，这并不干净。 我只更改每个文件中的配置

const config = {
  title: "Credits",
  icon: "copyright",
  url: "https://mysite.fr/credits"
}
import React from "react";
import { View } from "react-native";
import IconFeather from "react-native-vector-icons/Feather";
import Icon from "react-native-vector-icons/FontAwesome";
import StaticWebView from "project/src/page/StaticWebView.js"
import I18n from 'project/src/i18n/i18n';

export default class test extends React.PureComponent {
  static navigationOptions = ({ navigation }) => {
    return {
      title: I18n.t(config.title),
      headerLeft: <View style={{ padding: 10, alignItems: "center" }}>
        <IconFeather name="arrow-left" size={25} color='black'
          onPress={() => { navigation.goBack(); navigation.navigate("DrawerToggle"); }} />
      </View>,
      drawerLabel: I18n.t(config.title),
      drawerIcon: ({ tintColor }) => <Icon name={config.icon} size={20} color={tintColor} />
    };
  };
  render() {
    return (
      <StaticWebView url={config.url} />
    )
  }
}

我找不到任何如何将参数传递给抽屉导航器。 例如这样：

const MyDrawerNavigator = DrawerNavigator(
  {...
    CreditsPage: { screen: staticWebView , config:{ url :"...."} },       
    TermsOfUsePage: { screen: staticWebView , config:{ url :"...."} }, 
    LegalNoticePage: { screen: staticWebView , config:{ url :"...."} },      
  },
  {...}
);

有小费吗 ？

Answer 1

您可以使用以下props将参数传递给Drawernavigator

const MyDrawerNavigator = DrawerNavigator(
  {...
    CreditsPage: { screen: props => <StaticWebView {...props} url="...." /> },
    TermsOfUsePage: { screen: props => <StaticWebView {...props} url="...." /> },
    LegalNoticePage: { screen: props => <StaticWebView {...props} url="...." /> },      
  },
  {...}
);

您可以按以下方式在StaticWebView组件中访问道具

const URL = this.props.url;