Question

其实我有这个抽屉导航

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

CreditsPage，TermsOfUsePage，LegalNoticePage组件只显示一个webView，因此只有源网址会发生变化。 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} />
    )
  }
}

我找不到任何如何将参数传递给drawerNavigator。例如：

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;

react-native，将params传递给DrawerNavigator

1 个答案: