Как передать событие через stack navigator в скрин?

В React Native, для передачи события через Stack Navigator в скрин, можно использовать различные подходы. Один из них - использование параметров навигации.

Для начала, вам нужно установить и настроить react-navigation библиотеку. Для этого можно выполнить следующую команду в корне вашего проекта:

npm install @react-navigation/native

После этого вы можете настроить Stack Navigator следующим образом:

import { createStackNavigator } from '@react-navigation/stack';
import { NavigationContainer } from '@react-navigation/native';
import React from 'react';

// импортировать ваши скрины
import Screen1 from './screens/Screen1';
import Screen2 from './screens/Screen2';

const Stack = createStackNavigator();

function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen
          name="Screen1"
          component={Screen1}
        />
        <Stack.Screen
          name="Screen2"
          component={Screen2}
        />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;

В этом примере у нас два скрина - Screen1 и Screen2. Теперь вам нужно передать событие из Screen1 в Screen2. Для этого вы можете воспользоваться navigation.navigate('Screen2', { event: 'someEvent' }), передавая событие вторым параметром.

import React from 'react';
import { Button, View } from 'react-native';

function Screen1({ navigation }) {
  const handleButtonPress = () => {
    navigation.navigate('Screen2', { event: 'someEvent' });
  };

  return (
    <View>
      <Button title="Press me" onPress={handleButtonPress} />
    </View>
  );
}

export default Screen1;

Теперь, чтобы получить эту переданную информацию в Screen2, вы можете использовать route.params.event.

import React from 'react';
import { Text, View } from 'react-native';

function Screen2({ route }) {
  return (
    <View>
      <Text>Event: {route.params.event}</Text>
    </View>
  );
}

export default Screen2;

Таким образом, вы передали событие через Stack Navigator в скрин, используя параметры навигации. Этот подход позволяет легко передавать данные между скринами React Native при использовании react-navigation.