React Native：从数组创建标签导航器

Question

我正在尝试从数组创建选项卡导航器。我希望选项卡导航器为数组中的每个项目都有一个选项卡。这样，如果通过用户输入更新阵列，则选项卡将更新。

这是我到目前为止所拥有的；我无法通过映射数组来创建适当的RouteConfigs对象。

import React, {Component} from 'react';
import { ListView, Platform, StyleSheet, Text, View, Switch, TouchableOpacity, TextInput, Button, SafeAreaView } from 'react-native';
import { createStackNavigator, createMaterialTopTabNavigator } from 'react-navigation';

class GroupScreen extends Component {
  render() {
    return (
      <View>
        <Text>`${this.props.name}`</Text>
      </View>
    );
  }
}

let groups = ['Group1', 'Group2']

let screens = groups.map((group) => ({
  group: { screen: GroupScreen(name = group) },
}))

export default createMaterialTopTabNavigator(screens);