web-dev-qa-db-fra.com

NavigationActions.reset n'est pas une fonction?

J'ai créé un projet avec un écran Welcome, accédez à l'écran MainActivity. Je veux que lorsque l'utilisateur clique sur le bouton Retour, l'application se ferme dans l'écran MainActivity et non à l'écran Welcome. J'utilise la bibliothèque react-navigation, j'ai donc cherché une solution de Github.

Lorsque j'utilise le code de https://github.com/react-navigation/react-navigation/issues/295 . Je reçois l'erreur:

NavigationActions.reset is not a function

Je console.log (NavigationActions);

enter image description here

Il n'y a pas de réinitialisation évidemment. Mais pourquoi tout le monde peut-il utiliser le code?

Je ne peux pas comprendre. Toute aide serait appréciée. Merci d'avance.

Voici mon Welcome.js:

import React, { Component } from 'react';
import { View, Text, ActivityIndicator } from 'react-native';
import { NavigationActions } from 'react-navigation';
import { connect } from 'react-redux';
import { ColorSetting } from './common/ColorSetting';
import { fetchMainMovieList } from '../actions';

class Welcome extends Component {
  static navigationOptions = {
    header: null,
  };

  componentDidMount() {
    // call main page data first
    this.props.fetchMainMovieList();

    this.timer = setTimeout(() => { 
      this.navigateToMainActivity();
    }, 3000);
  }
  componentWillUnmount() {
    // if this.timer existed，then use clearTimeout to remove it.
    this.timer && clearTimeout(this.timer);
  }

  navigateToMainActivity() {
    console.log(NavigationActions);
    const resetAction = NavigationActions.reset({
      index: 1,
      actions: [
        NavigationActions.navigate({ routeName: 'MainActivity' })
      ]
    });

    this.props.navigation.dispatch(resetAction);
  }

  render() {
    return (
      <View>
        <Text>Three !</Text>
      </View>
    );
  }
}

export default connect(null, { fetchMainMovieList })(Welcome);
react-nativereact-navigation
17
Morton

dans la version> 2 de la navigation réactive, vous pouvez utiliser ce code pour réinitialiser la pile:

    import { NavigationActions, StackActions } from 'react-navigation';
    const resetAction = StackActions.reset({
            index: 0,
            actions: [NavigationActions.navigate({ routeName: 'MainActivity' })],
        });
    this.props.navigation.dispatch(resetAction);

J'espère que cela aidera ...

70
Ali Sn

Si vous utilisez un routeur imbriqué, vous devez également définir key sur null, sinon le navigateur reste actif.

import { NavigationActions, StackActions } from 'react-navigation'
const resetAction = StackActions.reset({
    index: 0,
    key: null, // <-- this
    actions: [NavigationActions.navigate({ routeName: route })]
})
this.props.navigation.dispatch(resetAction)
14
mehulmpt