Как передать state в navigation?

В React Native, для передачи состояния (state) в навигацию (navigation) существует несколько способов.

Первый способ - использование параметров навигации. В этом случае вы можете передать состояние в качестве параметра при вызове метода навигации. Например, если у вас есть навигатор StackNavigator и вы хотите передать состояние с именем "user" в экран "Profile", вы можете использовать следующий код:

this.props.navigation.navigate('Profile', { user: this.state.user });

Затем вы можете получить переданное состояние в экране "Profile" следующим образом:

const user = this.props.navigation.getParam('user', {});

При необходимости вы также можете указать значение по умолчанию (в данном случае пустой объект), чтобы избежать ошибок, если параметр не был передан.

Второй способ - использование контекста (Context). Контекст позволяет передавать данные вниз по дереву компонентов без явной передачи пропсов через каждый промежуточный компонент. Для использования контекста для передачи состояния в навигацию, вы должны создать контекст внутри вашего навигатора, а затем использовать его в каждом экране, где вы хотите получить состояние.

Ниже приведен пример кода, демонстрирующий это:

// Создаем контекст внутри навигатора
const MyContext = React.createContext();

// Ваш навигатор
const AppNavigator = createStackNavigator({
  Screen1: { screen: Screen1 },
  Screen2: { screen: Screen2 },
});

// Wrap your AppNavigator inside a component that provides the context
class AppWrapper extends React.Component {
  state = {
    user: { name: 'John Doe' },
  };

  render() {
    return (
      <MyContext.Provider value={this.state}>
        <AppNavigator />
      </MyContext.Provider>
    );
  }
}

// Экраны, использующие контекст для получения состояния
class Screen1 extends React.Component {
  static contextType = MyContext;

  render() {
    const { user } = this.context;
    return (
      <View>
        <Text>Welcome, {user.name}!</Text>
      </View>
    );
  }
}

class Screen2 extends React.Component {
  static contextType = MyContext;

  render() {
    const { user } = this.context;
    return (
      <View>
        <Text>Hello, {user.name}!</Text>
      </View>
    );
  }
}

В этом примере мы создаем контекст под названием "MyContext" внутри навигатора и используем его для передачи состояния (в данном случае объекта пользователя) в каждый экран. Затем мы устанавливаем контекст с использованием static contextType и получаем переданное состояние через this.context.

Таким образом, вы можете использовать один из этих двух способов для передачи состояния в навигацию в React Native. Который из них выбрать зависит от вашей особой ситуации и требований к вашему приложению.