как использовать react-native-router-flux с react-native-drawer. Я использую версию 3.38.0 для response-native-router-flux. Я пытаюсь вызвать Actions.refresh ({key: 'drawer', open: value =>! Value}); но это не работает. Вот мой код для моей навигации по ящикам.
import React, { Component } from 'react';
import Drawer from 'react-native-drawer';
import SideMenu from './SideMenu';
import {Actions, DefaultRenderer} from 'react-native-router-flux';
class DrawerNavigation extends Component {
render(){
const state = this.props.navigationState;
const children = state.children;
return (
<Drawer
ref="navigation"
open={state.open}
onOpen={()=>Actions.refresh({key:state.key, open: true})}
onClose={()=>Actions.refresh({key:state.key, open: false})}
type="displace"
content={<SideMenu />}
tapToClose={true}
openDrawerOffset={0.2}
panCloseMask={0.2}
negotiatePan={true}
tweenHandler={(ratio) => ({
main: { opacity:Math.max(0.54,1-ratio) }
})}>
<DefaultRenderer navigationState={children[0]} onNavigate=
{this.props.onNavigate} />
</Drawer>
);
}
}
экспорт по умолчанию DrawerNavigation;
Вот мое боковое меню
import React, { Component } from 'react';
import { View, Text, TouchableHighlight, StyleSheet } from 'react-native';
class SideMenu extends Component {
render() {
return (
<View style={styles.container}>
<TouchableHighlight>
<Text>Home</Text>
</TouchableHighlight>
<TouchableHighlight>
<Text>Profile</Text>
</TouchableHighlight>
<TouchableHighlight>
<Text>Friends</Text>
</TouchableHighlight>
</View>
);
} }
const styles = StyleSheet.create({
container: {
flex: 1,
padding: 30,
backgroundColor: 'white'
},
})
export default SideMenu;
Вот мой файл маршрутизации
import React from 'react';
import { Scene, Router, Actions, ActionConst } from 'react-native-router-
flux';
import RecoverForm from './components/RecoverForm';
import DrawerNavigation from './components/DrawerNavigation';
import Dashboard from './components/Dashboard';
import SignupForm from './components/SignupForm';
import LoginForm from './components/LoginForm';
const RouterComponent = () => {
return (
<Router sceneStyle={{ paddingTop: 50, flex: 1 }}>
<Scene key="auth">
<Scene
title="Please Login"
component={LoginForm}
key="login"
rightTitle="Hello"
onRight={() => Actions.drawer()}
/>
<Scene
title="Sign Up"
component={SignupForm}
key="signup"
/>
<Scene
title="Recover Password"
component={RecoverForm}
key="recover"
/>
</Scene>
<Scene key="drawer" component={DrawerNavigation} open=
{false} initial >
<Scene
title="Dashboard"
component={Dashboard}
key="dashboard"
hideNavBar={false}
initial
/>
</Scene>
</Router>
);
};
export default RouterComponent;