Implementation detail worries - Calling navigate on nested Navigator

问题

In summary - my question is, is there an alternative way to acheive this sidebar tabs, possibly/hopefully with TabNavigator? Or is my approach below not a implemenation detail and future-proof?

I am trying to create a tab navigator with tabs on side. I could not pull this off with TabNavigator so I I nested a StackNavigator with the following structure:

class PageShowroom extends React.Component {
    childnav = {}
    navRef = el => this.childnav.navigate = el && el._navigation.navigate
    navigateChild(...args) {
        this.childnav.navigate(...args);
    }
    render() {
        return (
            <View style={{flexDirection:'row'}}>
                <View>
                    <Button onPress={this.navigateChild('blah')} title="Blah" />
                </View>
                <ShowroomNavigator ref={this.navRef}/>
            </View>
        )
    }
}

const ShowroomNavigator = StackNavigator(
    { catalog: {screen:ScreenCatalog}, orders:{screen:ScreenOrders}},
    { initialRouteName: 'catalog', headerMode: 'none' }
);

I don't like it, but it works. Here is a screencast - https://youtu.be/r33WvOnb6jU

The stuff I don't like is:

1. There is a drop shadow around ShowroomNavigator which is a StackNavigator. I had to hide this drop shadow by doing z-index tricks and wrapping (code not shown above)
2. Sliding the nested router from the left edge does not go back.
3. The third problem, and the major problem, is I think I am relying on an implementation detail:

We see I attach a ref to ShowroomNavigator. The ref callback triggers twice, once on mount and once on unmount. On mount el is {props, context, refs, updated, subs, _isStateful, _handleOpenURL, dispatch, state, _reactInternalInstance, _navigate} and on unmount el is null.

So I am tapping into el._navigation.navigate, which I worry might be an implementation detail.

So my question is, is there an alternative way to acheive this sidebar tabs, possibly/hopefully with TabNavigator? Or is my el._navigation approach above not a implementation detail and is future-proof?

来源：https://stackoverflow.com/questions/43332027/implementation-detail-worries-calling-navigate-on-nested-navigator