react-native - 如何通过组件实现回调

Question

基本上，当它打开时，我单击该堆栈的其他页面，如果在第二个页面内按下特定按钮，我想实现一个回调来更新页面。我的问题是，导航到第二页的按钮位于在第一页上呈现的组件内，如下所示：

主页

<FlatList
  style={styles.listView}
  contentContainerStyle={styles.listContentView} 
  data={availableJobs}
  keyExtractor={service => service.id.toString()}
  renderItem={({item}) => <CompleteCalls style={styles.listItem} job={item}/>}
  showsHorizontalScrollIndicator={false}
  ListEmptyComponent={<MyEmpty />}
  horizontal   
/>

CompleteCalls 我有导航到第二页的按钮：

<TouchableOpacity 
  style={styles.buttonContainer}
  onPress={() => Navigator.navigate('ServiceDetails', {job} )}>
  <MyText style={styles.button}>Resumo</MyText>
  <MyIcon style={styles.resumeIcon}>{Icons.CHEVRON_RIGHT}</MyIcon> 
</TouchableOpacity>

所以基本上，我通过主页调用CompleteCalls组件内的ServiceDetails页面。

在ServiceDetails中，我渲染了另一个组件，即一个按钮，以执行一个功能。

<ActionButton job={job}/>

这个ActionButton只是呈现一个按钮并具有一个功能。

在ServiceDetails中，我可以直接返回主页。

当我单击ActionButton时，如何通过所有这些传递回调？当我点击按钮返回时，我需要更新主页，但当我转到其他页面时不需要更新，所以监听器很烦人，因为它在每次交互后重新加载页面。

标签： react-nativecallback