在 StackNavigator 上运行 componentWillMount 逻辑

Question

我正在尝试使用 React Native 编写一个基本的身份验证屏幕。

用户登录后将被重定向到其主屏幕。

为此我使用了一个StackNavigator，如下：

import React, { Component } from 'react';
import { StackNavigator } from 'react-navigation';

import LoginPage from './src/pages/login';

const MyApp = StackNavigator({
  Login: { screen: LoginPage },
  Home: { home: HomePage } 
});

export default MyApp;

但是我想在这里操作一些逻辑（比如DB init）。由于这是一个纯组件，我有点迷路了...

我该如何进行？例如，我可以 "transform" 将 StackNavigator 放入具有生命周期函数的组件中吗？

Answer 1

您可以这样将 Stacknavigator 对象变成 React.Component：

const MyAppStack = StackNavigator({
  Login: { screen: LoginPage },
  Home: { home: HomePage } 
});

class MyApp extends Component {
  componentWillMount() {}
  componentWillUnmount() {}

  render() {
    return <MyAppStack />;
  }
}

在 StackNavigator 上运行 componentWillMount 逻辑

Operate componentWillMount logic on a StackNavigator

react-native

react-navigation