Реагируйте на проблему навигации с NavigationActions - PullRequest
0 голосов
/ 07 мая 2018

У меня есть приложение, в котором я пытаюсь применить навигацию в некоторых случаях. Например, A , B , C , D - это мои вкладки и на вкладке A , у меня 3 страниц как 1, 2, 3. Теперь в ситуации, когда я на вкладке A и на page 3, есть одна кнопка, в которой я должен вернуться к page 1 на той же самой вкладке (A) . Но почему-то моя навигация не работает в этом случае. Ниже приведены мои коды:

SkippedTask.js

 import React from "react";
import {
  View,
  StyleSheet,
  Text,
  AsyncStorage,
  Dimensions,
  Image,
  ScrollView,
  Alert
} from "react-native";
import ButtonC from "../../components/ButtonC";
import { NavigationActions } from "react-navigation";

import Server from "../../provider/Server";

var { width, height } = Dimensions.get("window");

export default class SkippedTask extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      loadingState: false,
      api: new Server(),
      mobile: "",
      arrayLenght: "",
      tasklist: [],
      taskTitle: []
    };
  }

  renderSkippedQues() {
    return (
      <View style={{ marginTop: 0 }}>
        {this.state.taskTitle.map((item, key) => (
          <View key={key} style={{ marginTop: 0 }}>
            <Text style={{}}>
              <Text style={{ fontSize: 18, color: "#000" }}>{"\u2022"} </Text>{" "}
              {item}
            </Text>
          </View>
        ))}
      </View>
    );
  }

  handleNav = () => {
    this.props.navigation.dispatch(
      NavigationActions.reset({
        index: 0,
        actions: [NavigationActions.navigate({ routeName: "DashboardTab" })]
      })
    );
  };

  render() {
    if (this.state.arrayLenght <= 0) {
      return <View />;
    } else {
      return (
        <ScrollView>
          <View
            style={{
              justifyContent: "center",
              alignItems: "center",
              marginTop: height / 40
            }}
          >
            <Text style={{ fontSize: 16, color: "black", marginTop: 30 }}>
              List of skipped task are :
            </Text>
            {this.renderSkippedQues()}
            <View style={{ marginTop: 40 }} />
            <ButtonC
              title="    Click here to complete remaining task   "
              onPress={this.handleNav}
            />
          </View>
        </ScrollView>
      );
    }
  }
}

Ниже приведен мой файл App.js , в котором я использую StackNavigator из react-navigation.

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */
import { AppRegistry } from 'react-native';
import { StackNavigator } from 'react-navigation';

import SessionCheck from './src/screens/SessionCheck';
import LoginScreen from './src/screens/LoginScreen';
import RegisterScreen from './src/screens/RegisterScreen';
import ProfileScreen from './src/screens/ProfileScreen';
import WalletsScreen from './src/screens/WalletsScreen';
import DashboardAccept from './src/screens/DashboardAccept';
import TermsConditionsScreen from './src/screens/TermsConditionsScreen';
import DashboardTabScreen from './src/screens/DashboardTabScreen';
import Person from './src/components/profile/Person';
import Payment from './src/components/profile/Payment';
import List from './src/components/task/List';

const App = StackNavigator({

  // DashboardTab: { screen:DashboardTabScreen },
  Home: { screen: SessionCheck },
  Login: { screen: LoginScreen },
  Register: { screen: RegisterScreen },
  Profile: { screen:ProfileScreen },
  Wallets: { screen:WalletsScreen },
  DashboardAccept: { screen:DashboardAccept },
  TermsConditions: { screen:TermsConditionsScreen },
  DashboardTab: { screen:DashboardTabScreen },
  Person: {screen: Person},
  Payment : {screen: Payment},
  AllTask:{screen: List}
});

export default App;

Теперь мой случай заключается в том, что мне нужно перейти со страницы SkippedTask на экран AllTask ​​, как указано в файле App.js . Но я почему-то не могу решить эту проблему.

Любые выводы приветствуются. Спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...