Вызов функции снаружи в React Native

Question

У меня есть приложение React Native, и мне нужно вызвать функцию в определении HomeScreen, чтобы что-то сделать с ее элементами. Это действие должно выполняться пользовательским виджетом, который хранится вне HomeScreen. Я пытаюсь вызвать функцию из реквизита виджета, но она возвращает undefined. Итак, как я могу это сделать?

import React, { useState, useEffect, Component } from 'react';
import { Image, StyleSheet, Text, View, Button, Modal } from 'react-native';
import { LongPressGestureHandler } from 'react-native-gesture-handler';

export default function HomeScreen() {

  const doSomething = () => {
    console.log("Works");
  }

  return (
    <View style={{padding: 30}}>
      <LongPress
        action={() => {doSomething()}}
      >
        <View>
          <Text>Long press me</Text>
        </View>
      </LongPress>
    </View>
  );
};

function LongPress({children}, props) {
  return (
    <LongPressGestureHandler
      onHandlerStateChange={() => {HomeScreen.action}}
      minDurationMs={700}
    >
      <View>{children}</View>
    </LongPressGestureHandler>
  )
};

Answer 1

В вашем примере вы передаете action опору вашему LongPress компоненту. Предполагая, что это функция, которую вам нужно запустить, должно хватить следующего:

function LongPress({action, children}) {
  return (
    <LongPressGestureHandler
      onHandlerStateChange={action}
      minDurationMs={700}
    >
      <View>{children}</View>
    </LongPressGestureHandler>
  )
};

Answer 2

Вы можете использовать PubSub .

class DownloadManager{
    public static pointer;


    async download() {
        //download code
        //when download update
        PubSub.publish('download-complete', {status:true});
    }
}

class BackupPage extends React.Component<any, any> {

    componentDidMount() {
        PubSub.subscribe('download-complete', (msg, data) => {
            this.setState({ status :data.status})
        })
    }

    render() {
        //render code
    }
}