1

基本上我正在尝试使用抽屉导航，如下所示：

抽屉

import React, { PureComponent } from 'react';
import { Navigation } from 'react-native-navigation';
import { List, ListItem } from 'react-native-elements';

const list = [
    {
        title: 'Home',
        icon: 'av-timer'
    },
    {
        title: 'Training',
        icon: 'flight-takeoff'
    },
];

export default class Drawer extends PureComponent {
    _onPress(item) {
        console.log(this.props);
        //this.props.navigator.push
        this.props.navigator.setRoot({
            screen: item.title,
            title: item.title
        });
    }

    render() {
        return (
            < List style={{ flex: 1 }} >
                {
                    list.map((item, i) => (
                        <ListItem
                            key={i}
                            title={item.title}
                            leftIcon={{ name: item.icon }}
                            onPress={() => this._onPress(item)}
                        />
                    ))
                }
            </List >
        )
    }
}

导航 ：

import { Navigation } from 'react-native-navigation';
import Drawer from './src/Components/Drawer';
import Home from './src/Screens/Home';
import Training from './src/Screens/Training';


Navigation.registerComponent('Home', () => Home);
Navigation.registerComponent('Training', () => Training);
Navigation.registerComponent('Drawer', () => Drawer);



Navigation.startSingleScreenApp({
    screen: {
        screen: 'Home', // unique ID registered with Navigation.registerScreen
        title: 'Welcome', // title of the screen as appears in the nav bar (optional)
        navigatorStyle: {}, // override the navigator style for the screen, see "Styling the navigator" below (optional)
        navigatorButtons: {} // override the nav buttons for the screen, see "Adding buttons to the navigator" below (optional)
    },
    drawer: {
        // optional, add this if you want a side menu drawer in your app
        left: {
            // optional, define if you want a drawer from the left
            screen: 'Drawer', // unique ID registered with Navigation.registerScreen
            passProps: {}, // simple serializable object that will pass as props to all top screens (optional)
            disableOpenGesture: false, // can the drawer be opened with a swipe instead of button (optional, Android only)
            fixedWidth: 500 // a fixed width you want your left drawer to have (optional)
        },
        style: {
            // ( iOS only )
            drawerShadow: true, // optional, add this if you want a side menu drawer shadow
            contentOverlayColor: 'rgba(0,0,0,0.25)', // optional, add this if you want a overlay color when drawer is open
            leftDrawerWidth: 50, // optional, add this if you want a define left drawer width (50=percent)
            rightDrawerWidth: 50 // optional, add this if you want a define right drawer width (50=percent)
        },
        type: 'MMDrawer', // optional, iOS only, types: 'TheSideBar', 'MMDrawer' default: 'MMDrawer'
        animationType: 'door', //optional, iOS only, for MMDrawer: 'door', 'parallax', 'slide', 'slide-and-scale'
        // for TheSideBar: 'airbnb', 'facebook', 'luvocracy','wunder-list'
        disableOpenGesture: false // optional, can the drawer, both right and left, be opened with a swipe instead of button
    },
    passProps: {}, // simple serializable object that will pass as props to all top screens (optional)
    animationType: 'slide-down' // optional, add transition animation to root change: 'none', 'slide-down', 'fade'
});

我试过setRoot, push, 和popToRoot，但没有任何效果，这里有什么遗漏吗？

4

0 回答 0