Question

下面是动作代码的要点：它没有触发路线：AllFruits

我是否必须在Actions文件中提供屏幕列表？

import { NavigationActions } from 'react-navigation'

export const Create = ({address, cell, phone, comments, shift, _id  }) => {

    return async ( dispatch, NavigationActions ) => {
      console.log(' 44-  NavigationActions = ', NavigationActions);
      console.log(' 45-  NavigationActions.getState = ', NavigationActions.getState);
        try {
            const token = await AsyncStorage.getItem('token');
            if (token !== null) {
                axios.defaults.headers.common['authorization'] = token;
                axios.post(ROOT_URL, {
                        address: address,
                        cell: cell,
                        phone: phone,
                        comments: comments,
                        // shift : shift
                    })
                    .then(response => {
                        console.log('43 -  response of FRUIT create   response.data = ', response.data);
                        dispatch({
                            type: FRUIT_CREATE,
                            payload: response.data
                        });

                })
                .then(response => {
                    dispatch(NavigationActions.navigate({ routeName: 'allFruits' }));                    
            });
            }
        } catch (error) {
            console.log(error);
        }
    }; // end return (dispatch)
};

亚历山大提示之后更新。

从＆＃39; react-navigation＆＃39;

导入{NavigationActions}

export const Create =（{address，cell，phone，comments，shift，_id}）=＆gt; {

return async ( dispatch ) => {
  console.log(' 44-  NavigationActions = ', NavigationActions);
  console.log(' 45-  NavigationActions.getState = ', NavigationActions.getState);
    try {
        const token = await AsyncStorage.getItem('token');
        if (token !== null) {
            axios.defaults.headers.common['authorization'] = token;
            axios.post(ROOT_URL, {
                    address: address,
                    cell: cell,
                    phone: phone,
                    comments: comments,
                    // shift : shift
                })
            .then(response => {
                dispatch(NavigationActions.navigate({ routeName: 'allFruits' }));                    
        });
        }
    } catch (error) {
        console.log(error);
    }
}; // end return (dispatch)

};

问题：我是否必须在Actions文件中提供可用的路由？我想知道我是否遗漏了什么。

导航结构，（文件名和其他名称已更改但代码结构保持不变）

// App.js

import { AppLoading, Asset } from 'expo';
import { Font } from 'expo';
import React from 'react';
import { Platform, StyleSheet, Text, View } from 'react-native';
import { TabNavigator, StackNavigator } from 'react-navigation';
import { Provider } from 'react-redux';

import registerForNotifications from './services/push_notifications';
import store from './store';
import AuthScreen from './screens/AuthScreen';
import WelcomeScreen from './screens/WelcomeScreen';
import MapScreen from './screens/MapScreen';
import DeckScreen from './screens/DeckScreen';
import SettingsScreen from './screens/SettingsScreen';
import ReviewScreen from './screens/ReviewScreen';
import HomeScreen from './screens/homeScreens/HomeScreen';

// AND A LOT MORE SCREEN IMPORTS 



export default class App extends React.Component {

  componentDidMount() {
    console.log(' App.js  componentDidMount called');
    Font.loadAsync({
      'morbi-rounded': require('./assets/fonts/2BF294_D_0.ttf'),
    });
  }


    async _loadAssetsAsync() {
        try {
          await Asset.loadAsync([ require('./assets/loginAssets/login1_bg.png'),require('./assets/loginAssets/login1_mark.png'),require('./assets/loginAssets/login1_lock.png'),require('./assets/loginAssets/login1_person.png'),      require('./assets/signupAssets/back.png'), require('./assets/signupAssets/signup_person.png') ]);
        } finally {
          console.log(' 97 - App   assetsAreLoaded: true ');
          this.setState({ assetsAreLoaded: true });
        }
      }

        async _loadFontsAsync() {
          try {

            await Font.loadAsync({
                  'morbi-rounded': require('./assets/fonts/2BF294_D_0.ttf')    });
          }
          catch(e) {
              console.log(' 123 Error occurred while loading FONT Assets');
          }
           finally {
            console.log('123 - App   FONT FAMILY assetsAreLoaded: true ');
            this.setState({ assetsAreLoaded: true });
          }
        }

        componentDidMount() {
            this._loadAssetsAsync().done();
            this._loadFontsAsync().done();
          }



  render() {

    const MainNavigator = TabNavigator({

    auth: { screen : AuthScreen },
    followup: { screen: FollowupScreen },
    signin: { screen : SigninScreen },
    Login: { screen : LoginScreen },
    signup: { screen : SignupScreen },
    signUp_2: { screen : SignUpScreen_2 },

    VerifyAccount: { screen : VerifyAccount },
    ForgotPassword: { screen: ForgotPasswordScreen },
    PasswordChange: { screen: PasswordChangeScreen },

    main: {
      screen: TabNavigator ({
        followup: { screen: FollowupScreen },
        Search: { screen: SearchScreen },
        Priceview: {
                screen: StackNavigator({
                  map: { screen: MapScreen },
                  priceScreen: { screen: priceScreen },
                  priceDetails: { screen: priceDetailsScreen },
                })
              },
        settings : {
          screen: StackNavigator ({
            settings: { screen: SettingsScreen },
            MyProfile: { screen: MyProfileScreen },
            Subscription: { screen: SubscriptionScreen },
            HelpSupport: { screen: HelpSupportScreen },
            Notifications: { screen: NotificationsScreen },
            Feedback: { screen: FeedbackScreen },
            EmailTemplate: { screen: EmailTemplateSetup },
            Signout: { screen: SignoutScreen }  
          })
        },
        followup : {
          screen: StackNavigator ({
            followup: { screen: FollowupScreen },
            allFruits: { screen: AllFruitsScreen },
            createFruits: { screen: FruitsCreateScreen },
            editProperty: { screen: FruitsEditScreen },
            todayScreen: { screen: TodayScreen },
            Comment: { screen: CommentScreen },
            Email: { screen: EmailScreen },
          })
        }
      },{
        tabBarOptions: {
            labelStyle: {
              fontSize: 10,
            },
            showIcon: true,
            style: {
              overflow: 'visible'
            }
          },
          tabBarComponent: TabBarBottom,
          tabBarPosition: 'bottom'
      }) //screen: TabNavigator
    }
}, {
navigationOptions: {
    tabBarVisible: false
},
lazy: true,
});




return (
<Provider store={store}>
<MainNavigator />
</Provider>
);


}
}

const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});

Store / index.js

 import { createStore, compose, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import reducers from '../reducers';

const store = createStore(
    reducers,
    {},
    compose (
      applyMiddleware(thunk)
  )
);


export default store;

Answer 1

Herre是我解决这个问题的方法，就像@alexander建议的那样，我不得不通过this.navigation

   handleFormSubmit({ par1, par2 }) {
var nav_param =   this.props.navigation;

  this.props.fruitCreate(({ par1, par2, nav_param }), () => {
            console.log('118- in handleFormSubmit request send to the Actions');


            });
          }

当它在后端调用Actions时，

export const fruitCreate = ({ par1, par2, par3, nav_param  }) => {

    return async ( dispatch ) => {

      // MAKE THE BACKEND POST REQUEST AND ThEN 

                .then(response => {
                    console.log('59 -  response of propertyCreate   response.data = ', response.data);
                    nav_param.navigate('allFruits')
                    }

使用react-navigation如何从react-native app中的Actions触发Navigate？

1 个答案: