Question

我正在打开一个模态，嵌套在react-navigation TabNavigator中。这个模态用于将队友添加到Realm数据库中。保存新队友后，我关闭模态并“导航”回显示从我的Realm数据库中检索到的所有队友的ScrollView。

我的问题是关闭模态时此ScrollView不会重新渲染。

我没有使用Redux或任何其他州经理。

这是保存用户时执行的代码：

    onButtonPress() {
    var teammate = new TeammateModel(this.firstname, this.lastname);
    if (this.firstname && this.lastname) {
        TeammateService.save(teammate);
        this.props.navigation.goBack(null);
    } 
}

这是渲染ScrollView的组件的代码：

export default class Team extends Component {

componentWillMount() {
    teammates = TeammateService.findAll();
}

render() {
    return (
        <ScrollView>
            <List>{teammates.map((teammate) => (
            <ListItem 
                key={teammate.id}
                title={`${teammate.firstname} ${teammate.lastname}`}
            />
            ))}
            </List>
        </ScrollView>
    );
}
}

根据要求，这里也是我发生导航的routes.js：

export const TeamStack = StackNavigator({
Team: {
    screen: Team,
    navigationOptions: ({ navigation }) => ({
        headerTitle: 'Team',
        headerRight: <Button title="Add" onPress={() => navigation.navigate('EditTeammate')} />
    }),
},
})

export const EditTeammateStack = StackNavigator({
EditTeammate: {
    screen: EditTeammate,
    navigationOptions: ({ navigation }) => ({
        headerTitle: 'Teammate',
        headerLeft: <Button title="Cancel" onPress={() => navigation.goBack(null)} />
    }),
}
})


export const NoteStack = StackNavigator({
EditNote: {
    screen: EditNote,
    navigationOptions: ({ navigation }) => ({
        headerTitle: 'Edit note'
    })
}
})

export const Tabs = TabNavigator({

EditNote: {
    screen: NoteStack,
    navigationOptions: ({ navigation }) => ({
        header: { visible: true },
        headerTitle: 'Edit note',
        tabBarLabel: 'Notes',
        tabBarIcon: ({ tintColor }) => <Icon name="list" size={20} color={tintColor} />
    }),
},
Team: {
    screen: TeamStack,
    navigationOptions: ({ navigation }) => ({
        header: { visible: true },
        headerTitle: 'Team',
        tabBarLabel: 'Team',
        tabBarIcon: ({ tintColor }) => <Icon name="users" size={20} color={tintColor} />
    }),
}
}, {
initialRouteName: 'Team',
});

export const Root = StackNavigator（{ 标签：{ 屏幕：标签， }， EditTeammate：{ screen：EditTeammateStack， }， }，{ 模式：'模态'， headerMode：'none' }）;

导出默认Root;

我确定我做错了一件事（或更多件事）。但是什么？：）

关闭反应导航模式时强制滚动视图重新渲染？

0 个答案: