从本机导航V1迁移到V2

时间:2019-11-26 19:41:09

标签: javascript react-native react-native-navigation

从RN 0.55.4成功升级到0.59.10后,我发现RNN V1无法正常工作,因此我已迁移到RNN V2。另外,我还需要更改代码,因为似乎函数“ Navigation.startSingleScreenApp({”不适用于RNN V2。使用RNN V2以及this.props.navigator无法转移道具的问题已在RNN V2中使用。

有人可以告诉我使用RNN2修改代码并使用道具设置Root的正确方法吗?还是至少让我知道如何在RN 0.59。+中使Navigation.startSingleScreenApp识别功能?我的app.js是:

import React, {Component} from 'react';
import {
    AppRegistry,
    View,
    I18nManager
} from 'react-native';
import { Global } from '@settings';
I18nManager.forceRTL(Global.RTL)
import { Navigation } from 'react-native-navigation';
import { registerScreens } from './containers';
registerScreens();

console.disableYellowBox = true;

Navigation.startSingleScreenApp({
    screen: {
        screen: 'name.SplashLayout1',
        title: "HOME",
        navigatorStyle: {
            navBarHidden: true
        }
    },
    animationType: "none"
});


我的index.js

import React, {Component} from 'react';
import {
    View,
    StyleSheet,
    Dimensions,
} from 'react-native';
import FastImage from 'react-native-fast-image'
import {EgaTheme} from '@EgaMaterials';
import { Navigation } from 'react-native-navigation';

import { Theme } from './common/BlogTheme.style';
import Config from './common/Config'

import { Global } from '@settings';

var {height, width} = Dimensions.get('window');
var _ = require('lodash');

import { WordpressService, NofiticationService } from '@services';


export default class BlogThemeLayout extends Component {
    constructor(props) {
        super(props);

        this.state = {
            visible: true,
        };
    }
    componentWillMount() {

        WordpressService.startWordpressApp(this, Config.THEME_SETTINGS.menuID);
        EgaTheme.setTheme(Theme, null);
       // this.startApp()
    }

    startApp() {


        Navigation.startSingleScreenApp({

            screen: {

              screen: 'name.Homescreen', 
              title: 'Welcome', 
              navigatorStyle: {
                navBarBackgroundColor: Theme.colors.primary,
                navBarTextColor: Theme.colors.text.light,
                navBarButtonColor: Theme.colors.text.light
              },
              navigatorButtons: {} 
            },
            appStyle: {
              navBarBackgroundColor: Theme.colors.primary,
              navBarTextColor: Theme.colors.text.light,
              navBarButtonColor: Theme.colors.text.light,
              navBarNoBorder: true,
              orientation: 'portrait',
              disableOpenGesture: true,
              topBarElevationShadowEnabled: false
            }, //
            drawer: {
                left: {
                    screen: 'name.drawer',
                    passProps: {
                        SECTIONS_MENU: Global.SECTIONS_MENU_WORDPRESS,
                    }
                },

                appStyle: {
                  navBarBackgroundColor: Theme.colors.primary,
                  navBarTextColor: Theme.colors.text.light,
                  navBarButtonColor: Theme.colors.text.light,
                  navBarNoBorder: true,
                  orientation: 'portrait',
                  disableOpenGesture: true
                }, 
                disableOpenGesture: true
            },
            passProps: {
                SECTIONS_MENU: Global.SECTIONS_MENU_WORDPRESS
            },
            animationType: 'fade'
        });



    }

    render() {

        return this.renderLoadingView()
    }

    renderLoadingView() {
        return (

            <View style={styles.loading}>
              <FastImage resizeMode={FastImage.resizeMode.cover}
                         style={{ position: 'absolute', left: 0, top: 0, width: width, height: height }} source={require('./images/splash.jpg') }/>

                {/* { Platform.OS == 'ios' && <Spinner visible={this.state.visible} /> } */}

            </View>

        );
    }
}

const styles = StyleSheet.create({
    loading: {
        flex: 1,
        position: 'absolute',
        width: width,
        height: height,
        zIndex: 9,
        backgroundColor: 'white',
        justifyContent: "center",
        alignItems: "center"
    },
});

0 个答案:

没有答案