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;
はReduxのサンクを使用していますか?そうでない場合は、どこから発送されますか –
はい私はredux-thunkを使用しています –
'dispatch(()=> NavigationActions.navigate({routeName: 'allFruits'})))); ' – bntzio