NavigationActions.reset 不是函数吗? [英] NavigationActions.reset is not a function?

问题描述

我创建的项目有一个 Welcome 屏幕导航到 MainActivity 屏幕.我希望当用户单击后退按钮时，它会关闭 MainActivity 中的应用程序，而不是返回 Welcome 屏幕.我使用库 react-navigation，所以我从 Github 寻找一些解决方案.

当我使用

显然没有重置.但为什么其他人都可以使用代码?

我想不通.任何帮助，将不胜感激.提前致谢.

这是我的 Welcome.js:

import React, { Component } from 'react';从'react-native'导入{视图、文本、活动指示器}；从反应导航"导入 { NavigationActions };从'react-redux'导入{连接}；从'./common/ColorSetting'导入{颜色设置}；从 '../actions' 导入 { fetchMainMovieList };欢迎类扩展组件{静态导航选项 = {标题:空，};componentDidMount() {//先调用主页面数据this.props.fetchMainMovieList();this.timer = setTimeout(() => {this.navigateToMainActivity();}, 3000);}componentWillUnmount() {//如果 this.timer 存在，则使用 clearTimeout 删除它.this.timer &&clearTimeout(this.timer);}导航到主活动(){控制台日志(导航操作)；const resetAction = NavigationActions.reset({指数:1，行动:[NavigationActions.navigate({ routeName: 'MainActivity' })]});this.props.navigation.dispatch(resetAction);}使成为() {返回 (<查看><文字>三！</文字></查看>);}}导出默认连接(空，{ fetchMainMovieList })(欢迎)；

解决方案

V5.x 更新:

import { CommonActions } from '@react-navigation/native';const resetAction = CommonActions.reset({指数:1，路线:[{ 名称:YOUR_ROUTE_NAME，参数:{ YOUR_OPTIONAL_DATA } }]});navigation.dispatch(resetAction);

---

在react导航的>2版本中，可以使用此代码重置堆栈:

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

我希望这会有所帮助...

I created a project has a Welcome screen navigate to MainActivity screen. I want that when the user clicks the back button it will close the app in MainActivity not back to Welcome screen. I use the library react-navigation, so I looked for some solution from Github.

When I use the code from https://github.com/react-navigation/react-navigation/issues/295. I get the error:

NavigationActions.reset is not a function

I console.log(NavigationActions);

There is no reset obviously. But why can everybody else use the code?

I can't figure it out. Any help would be appreciated. Thanks in advance.

Here is my 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);

解决方案

Update for V5.x:

import { CommonActions } from '@react-navigation/native';


const resetAction = CommonActions.reset({
    index: 1,
    routes: [{ name: YOUR_ROUTE_NAME, params: { YOUR_OPTIONAL_DATA } }]
});
navigation.dispatch(resetAction);

---

in version >2 of react navigation, you can use this code to reset stack:

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

I hope this will help...

这篇关于NavigationActions.reset 不是函数吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！