react native 在 main 中渲染另一个组件

Question

我想在主组件中渲染另一个组件，这样用户就不会面对一秒钟的白屏！我正在使用 react-navigation 的 TabNavigator，当我想在选项卡之间切换时，我会看到一秒钟的白屏（似乎需要一秒钟才能呈现）。我正在考虑在第一个选项卡中呈现第二个选项卡，这样我可以获得更好的用户体验！ P.s。 : 我的组件在单独的文件中！

主线：

export default class AdCalc extends React.Component {
  render() {
    return (
      <View>
        <Text>
          TEST
        </Text>
      </View>
    );
  }
}

和我的 child:

export default class Child extends React.Component {
  render() {
    return (
      <View>
        <Text>
          This is child!
        </Text>
      </View>
    );
  }
}

thanks in advance!

Answer 1

您可以使用 react-navigation TabNavigatorConfig 的惰性属性。传递 lazy={false} 以便您的视图可以在初始启动时加载。那你就不会看到这样的画面了。

react native 在 main 中渲染另一个组件

react native render another component in main

render

tabnavigator

react-native

react-navigation