CODEWITHSUNDEEP
react-nativenavigation
Marco Disco
Marco Disco

Reputation: 565

React Native - Navigation with functional components

I installed Navigation to take some data from a page and send to another (hopefully I will). But it doesn't work and I get

"We couldn't find a navigation object. Is your component inside a navigator?"

File Insert.js

import React, { useState } from "react";
import { createAppContainer } from "react-navigation";
import { createStackNavigator } from "react-navigation-stack";
import { useNavigation } from "@react-navigation/native";


import ViewData from "./ViewData";

const MainNavigator = createStackNavigator({
  ViewDataPage: ViewData
});

...

const Insert = props => {

...

  createAppContainer(MainNavigator);

  const navigate = useNavigation();

  return (
    <TouchableWithoutFeedback
      onPress={() => {
        Keyboard.dismiss();
      }}
    >
      <View style={styles.inputContainer}>
        <Input
          placeholder="Your Name"
          onChangeText={text => setEnteredName(text)}
          value={enteredName}
        />


...


        <View>
          <Button
            title="Submit"
            onPress={() => sendValues(enteredName, enteredSurname)}
          />
          <Button
            title="Click"
            onPress={() =>navigate("ViewDataPage", { name: "Jane" })
            }
          />
        </View>
      </View>
    </TouchableWithoutFeedback>

I think I made a mess, I can't even get the page "ViewData". I would like to change page sending some values in the hooks Any idea where I mistook?

Upvotes: 1

Views: 1081

Answers (1)

satya164
satya164

Reputation: 10152

"@react-navigation/native" is for React Navigation 5. You can't use it with React Navigation 4.

Upvotes: 1

Related Questions