带有反应导航和反应功能组件的动态选项卡

时间:2019-09-16 10:48:29

标签: react-native react-navigation

我需要使用react-navigation-tabs创建动态标签。 当我们尝试创建自定义导航器时,应将导航组件router的属性分配给我们的组件。但我需要在内部传递它:

import React from 'react';
import { Text } from 'react-native';
import { createMaterialTopTabNavigator } from 'react-navigation-tabs';
import { useQuery } from '@apollo/react-hooks';
import { findChildren } from '../../../graphql/queries';
import UserAvatar from 'react-native-user-avatar';
import styles from '../../../styles';
import ChildTab from './childTabAsParent';

export default props => {
  let { data, loading, error, client } = useQuery(findChildren);
  if (loading) {
    return <Text>LOADING</Text>;
  }
  if (error) {
    return <Text>Error</Text>;
  }

  let tabs = data.findChildren.map((child, index) => {
    return {
      screen: props => <ChildTab childUserId={child.id} {...props} />,
      navigationOptions: {
        title: `${child.Profile.firstName} ${child.Profile.lastName}`,
        tabBarIcon: ({ tintColor }) => (
          <UserAvatar
            size={30}
            name={`${child.Profile.firstName} ${child.Profile.lastName}`}
            src={child.Profile.avatar}
          />
        ),
      },
    };
  });
  let DynTab = createMaterialTopTabNavigator({ ...tabs });
  return <DynTab {...props} />;
};

但是我怎么说当前的导出组件router属性等于DynTab.router

0 个答案:

没有答案