原生native传参进ReactNative导航根视图StackNavigator时的参数处理方法

原生部分代码这里就不贴了，直接参考官网即可。

这里只讲RN部分如何处理，因为导航根视图StackNavigator的页面中并不是常规的RN组件创建过程，而是直接调用了react-navigation给我们集成好的配置入口完成导航根目录的设置。也就是说，在这里我们是无法调用函数也无法获取到this.props的。

可是原生传入的props参数只能够传递到这里，那么我只能去他的源码里面做文章了

经过查找，找到了导航栏组件的创建文件

文件位置：项目目录/node_modules/react-navigation/src/navigators/createNavigator.js

/* @flow */

import React from 'react';

import type {
  NavigationRouter,
  NavigationNavigator,
  NavigationNavigatorProps,
  NavigationRouteConfigMap,
} from '../TypeDefinition';
import {
  setConfig,
  setRole,
} from '../../../../app/common/BFConfig'
import type { NavigatorType } from './NavigatorTypes';

/**
 * Creates a navigator based on a router and a view that renders the screens.
 */
export default function createNavigator<C: *, S, A, NavigatorConfig, Options>(
  router: NavigationRouter<S, A, Options>,
  routeConfigs?: NavigationRouteConfigMap,
  navigatorConfig?: NavigatorConfig,
  navigatorType?: NavigatorType
) {
  return (
    NavigationView: ReactClass<C>
  ): NavigationNavigator<C, S, A, Options> => {
    class Navigator extends React.Component {
      props: NavigationNavigatorProps<Options, S>;

      static router = router;

      static routeConfigs = routeConfigs;
      static navigatorConfig = navigatorConfig;
      static navigatorType = navigatorType;

      //@Lo 在这里将原生属性传入
      componentWillMount(){
        var originGroup = this.props.roleGroup;
        var originCode = this.props.roleCode;
        var originName = this.props.roleName;
        var userName = this.props.userName;
        var serverIP = this.props.serverIP;
        var serverType = this.props.serverType;
        //保存进config中。
        setConfig(userName,serverIP,serverType);
        setRole(originGroup,originCode,originName);
      }

      render() {
        return <NavigationView {...this.props} router={router} />;
      }
    }

    return Navigator;
  };
}

这里就是导航根视图的组件创建地了，就按照常规RN组件的生命周期函数随便拿一个进去处理我们需要的参数即可。

我是直接在配置文件里开了两个配置函数出来方便调用，

../../../../app/common/BFConfig

4个../就返回到项目目录了，可以自行引入需要的文件。