Redux-子组件之间的触发功能

Question

社区！ 我正在为这个项目使用React Native和react-navigation。在执行其中一个屏幕时，我意识到我有问题，但我不知道如何通过单击其标题上的按钮来触发主屏幕中的功能。就我而言，我有一个“全部阅读”按钮，可更改所有未读通知的颜色。

我想到的第一个解决方案是使用redux以某种方式再次调用屏幕主体中的提取函数。

下面是我的导航器和屏幕的实际代码。

导航器

export const NotificationStack = createStackNavigator(
  {
    Notification: {
      screen: Notifications,
      navigationOptions: ({ navigation }) => ({
        headerLayoutPreset: "center",
        headerTransparent: false,
        headerLeft: null,
        headerRight: null,

        headerTitle: (
          <Header
            title="Notifications"
            hasChildren
            isLeftChild={
              <BackButton
                navigation={navigation}
                needCommentInputClean={false}
              />
            }
            isRightChild={<NotificationsReadAll />}
          />
        ),
        headerStyle: {
          height: 50,
          elevation: 1.5,
          shadowOpacity: 0.5,
          backgroundColor: "#f7f7f8"
        }
      })
    }
  },
  {
    cardStyle: {
      backgroundColor: "#fff",
      opacity: 1
    }
  }
);

屏幕：

class Notifications extends React.Component {
  state = {
    activityLimit: 0,
    loading: false,
    activities: []
  };

  componentDidMount() {
    this.loadActivities();
  }

  loadActivities = () => {
    const { loading, activities, activityLimit } = this.state;

    if (loading) return;
    if (activities.length < activityLimit && !newActivity) return;

    this.setState({ loading: true });

    getLatestActivity(activityLimit)
      .then(result => {
        this.setState({
          activities: result,
          activityLimit: activityLimit + 10,
          loading: false
        });
      })
      .catch(() => {
        this.setState({ loading: false });
      });
  };

  render() {
    const { activities, activityLimit, loading } = this.state;
    const { navigation } = this.props;

    return (
      <View>
        <NotificationsList
          loading={loading}
          activities={activities}
          activityLimit={activityLimit}
          loadActivities={this.loadActivities}
          navigation={navigation}
        />
      </View>
    );
  }
}