2

如何重新渲染react-native-tab-view使用相同共享子组件的选项卡 ( )？

我有 3 个js文件；Parent,TabView和Item.

我在父级中有 2 个选项卡；All并且Downloaded使用具有不同道具的相同子组件。我可以看到All包括项目中的所有Downloaded项目。All当我更新选项卡上项目的状态时，我想更新选项卡视图中项目的状态Downloaded。我尝试过传递道具并使用回调，但即使使用方法，我也无法让它更新另一个选项卡上的视图forceUpdate。

家长：

renderScene = ({route}) => {
    switch (route.key) {
        case 'all':
            return <DocumentTabView /** ..props all items **/ />
        case 'downloaded':
            return <DocumentTabView /** ..props downloaded only **/ />
        default:
            return <DocumentTabView /** ..props all items **/ />
    }
};

render() {
    return (
        <TabView
            lazy
            navigationState={this.state}
            renderScene={this.renderScene}
            renderHeader={this.renderHeader}
            onIndexChange={this.handleIndexChange}
        />
    );
}

选项卡视图：

render() {
    return (
        <SafeAreaView
            forceInset={{top: 'always'}}
            style={documentStyles.container}>
            <ScrollView
                contentContainerStyle={documentStyles.scrollview}
                refreshControl={
                <RefreshControl
                    refreshing={this.props.isRefreshing}
                    onRefresh={this.props.refreshCallback}
                />
            }>
                {this.state.dataSource.map((item, index) => {
                    return (
                        <Item /** ..props **/ />
                    );
                })}
            </ScrollView>
        </SafeAreaView>
    );
}
4

0 回答 0