Сначала извините за мой плохой английский.
Я работаю над сборкой приложений из React-native.Для навигации я использую шаблон избыточности.
У меня большая проблема, и я не могу понять, что происходит.
Сначала у меня есть навигатор для компонентов:
import React from 'react';
import {
createStackNavigator,
createSwitchNavigator,
createBottomTabNavigator
} from 'react-navigation';
import { connect } from 'react-redux';
import Login from '../auth/login';
import CreateTrip from '../trip/create';
import DeleteTrip from '../trip/delete';
import Signup from '../signup/signup';
import Trip from '../trip/index';
import Secured from '../home/home';
import ConfirmIdentity from '../confirmIdentity';
import {createReactNavigationReduxMiddleware, reduxifyNavigator} from "react-navigation-redux-helpers";
const middleware = createReactNavigationReduxMiddleware(
'root',
state => state.nav
);
const RootNavigator = createStackNavigator({
loginFlow: {
screen: createBottomTabNavigator({
Login: {screen: Login , navigationOptions: { tabBarVisible: false }},
Register: {screen: Signup , navigationOptions: { tabBarVisible: false }},
},
{initialRouteName: 'Login'})
},
homeFlow: {
screen: createBottomTabNavigator({ Dashboard: {screen: Secured},
Trip: {screen: Trip, navigationOptions: { tabBarVisible: false }},
ConfirmIdentity: {screen: ConfirmIdentity, navigationOptions: { tabBarVisible: false }},}),
},
tripFlow: {
screen: createSwitchNavigator({
CreateTrip: {screen: CreateTrip},
DeleteTrip: {screen: DeleteTrip}
},
{initialRouteName: 'CreateTrip'})
}
},
{navigationOptions: {header: null}});
const AppWithNavigationState = reduxifyNavigator(RootNavigator, 'root');
const mapStateToProps = state => ({
state: state.nav,
});
const AppNavigator = connect(mapStateToProps)(AppWithNavigationState);
export { RootNavigator, AppNavigator, middleware };
Мои редукторы nav:
import { NavigationActions } from 'react-navigation';
import { RootNavigator } from '../../components/navigator/navigation';
const initialNavState = RootNavigator.router.getStateForAction(NavigationActions.navigate({ routeName: 'Login' }));
function navAuthReducer(state = initialNavState, action) {
let nextState;
RootNavigator.router.display = false;
console.log(action.type);
switch (action.type) {
case 'LOGIN':
nextState = RootNavigator.router.getStateForAction(
NavigationActions.navigate({ routeName: 'Dashboard' }),
state
);
break;
case 'LOGOUT':
nextState = RootNavigator.router.getStateForAction(
NavigationActions.navigate({ routeName: 'Login' }),
state
);
break;
case 'GOREG':
nextState = RootNavigator.router.getStateForAction(
NavigationActions.navigate({ routeName: 'Register' }),
state
);
break;
case 'CREATE':
nextState = RootNavigator.router.getStateForAction(NavigationActions.navigate({ routeName: 'CreateTrip' },
state
));
break;
case 'DELETE':
nextState = RootNavigator.router.getStateForAction(
NavigationActions.navigate({ routeName: 'DeleteTrip' }),
state
);
break;
default:
nextState = RootNavigator.router.getStateForAction(action, state);
break;
}
// Simply return the original `state` if `nextState` is null or undefined.
return nextState || state;
}
export default navAuthReducer;
Вот мой указатель поездки.На этой странице я могу нажать на кнопку, чтобы перейти к делу CREATE:
import {Component} from "react";
import connect from "react-redux/es/connect/connect";
import React from "react";
import {Button, ScrollView, Text} from "react-native";
import {creatingTrip} from "../../actions/trip";
class Index extends Component {
createTrip(e) {
e.preventDefault();
this.props.onCreateTrip();
}
render() {
return (
<ScrollView>
<Text>${this.props.isCountryExist}</Text>
<Button onPress={(e) => this.createTrip(e)} title="Logout"/>
</ScrollView>
);
}
}
const mapStateToProps = (state, ownProps) => {
return {
isCountryExist: state.tripReducer.isCountryExist
};
};
const mapDispatchToProps = (dispatch) => {
return {
onCreateTrip: () => { dispatch(creatingTrip()); }
}
};
export default connect(mapStateToProps, mapDispatchToProps)(Index);
Когда я иду к делу CREATE, я не знаю, почему мои приложения отображают страницу входа.
То, что я сделал:
- Проверьте значение типа, и оно "CREATE".
- Найти решение в сети
- Переписать файл полностью
- Отладить с console.log, чтобы понять поведение
Спасибо за все ответы.
введите описание изображения здесь