将道具从组件传递到TabNavigator-React-Navigation

Question

我目前正在从事Android的React Native项目。现在，我使用React Navigations createMaterialTopTabNavigator创建了一个TabNavigator，其中显示了两个标签：

最好将此TabNavigator用作可重用组件。因此，我正在尝试从调用导航器的组件传递道具。不幸的是，我无法弄清楚如何正确传递道具。

这是调用TabNavigator（在此命名为TwoTabsHorizontal）的组件：

import React from 'react';
import {View, StyleSheet} from 'react-native';

import {withNavigation} from 'react-navigation';

import Background from '../../atoms/Background/Background';
import TwoTabsHorizontal from '../../molecules/TwoTabsHorizontal/TwoTabsHorizontal';

class Main extends React.Component {
  render() {
    return (
      <View style={styles.view}>
        <Background background={true} title="Find Dogs" />
        <TwoTabsHorizontal
          headingLeftTab="criteria"
          headingRightTab="names"
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  view: {
    backgroundColor: '#151414',
    height: '100%',
  },
});

export default withNavigation(Main);

这是TabNavigator TwoTabsHorizontal：

import React from 'react';
import {View, StyleSheet} from 'react-native';

import {createMaterialTopTabNavigator} from 'react-navigation-tabs';
import {createAppContainer} from 'react-navigation';

import TestScreen1 from '../../../screens/TestScreen1';
import TestScreen2 from '../../../screens/TestScreen2';

const TabNavigator = ({headingLeftTab}) =>
  createMaterialTopTabNavigator(
    {
      One: {
        screen: TestScreen1,
        navigationOptions: {
          tabBarLabel: {headingLeftTab},
        },
      },
      Two: {
        screen: TestScreen2,
        navigationOptions: {
          tabBarLabel: 'Names',
        },
      },
    },
    {
    },
  );

export const TwoTabsHorizontal = createAppContainer(TabNavigator);

如您所见，我尝试将道具headingLeftTab从Main传递到TwoTabsHorizontal，以将其用作navigationOptions中的标签。它给出以下错误：

我已经尝试过建议使用here的方法。