2017-09-26 15 views
0

アクションコードの主旨:ルートをトリガーしません:AllFruits反応ナビゲーションを使用する反応ネイティブアプリケーションのアクションからナビゲートするにはどうすればよいですか?

何らかの理由でアクションファイルの画面のリストを提供する必要はありますか?

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) 
}; 

アレクサンダーヒント後の更新。

'反応ナビゲーション' から

インポート{NavigationActions}

エクスポートCONST作成=({アドレス、細胞、電話、コメント、シフト、_id})=> {

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) 

}。

質問:アクションファイルで使用できるルートを指定する必要がありますか?私は何かが不足しているのだろうか。

ナビゲーションの構造、(ファイル名や他の名前が変更されていますが、コードの構造は同じまま)

// 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', 
}, 
}); 

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; 
+0

はReduxのサンクを使用していますか?そうでない場合は、どこから発送されますか –

+0

はい私はredux-thunkを使用しています –

+0

'dispatch(()=> NavigationActions.navigate({routeName: 'allFruits'})))); ' – bntzio

答えて

0

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'); 


      }); 
      } 

は、

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') 
        } 
関連する問題