</>SkillRecallRECALL WHAT YOU KNOW
Sign in
Explore Library
React NativeNavigation

28 items

1

Fixing useNavigation Import

Code Quiz
2

Native Stack vs JS Stack Navigator

Slides / Video
3

Creating a Bottom Tab Navigator

Code Quiz
4

Hardware Back Button Handling

Code Quiz
5

Nesting Stack Inside Tabs

Code Quiz
6

Resetting Navigation State

Code Quiz
7

Setting Screen Options

Code Quiz
8

Navigating to Nested Screen

Code Quiz
9

Modal Presentation with Stack

Code Quiz
10

Going Back with goBack

Code Quiz
11

push vs navigate Behavior

Code Quiz
12

TypeScript Typing for Params

Code Quiz
13

Reading Route Params

Code Quiz
14

Custom Header Right Button

Code Quiz
15

Defining Screens with Stack.Screen

Code Quiz
16

replace vs navigate

Code Quiz
17

Creating a Drawer Navigator

Code Quiz
18

Dynamic Header with setOptions

Code Quiz
19

Creating a Stack Navigator

Code Quiz
20

Navigating Between Screens

Code Quiz
21

Passing Params Back to Previous Screen

Code Quiz
22

NavigationContainer Root Wrapper

Code Quiz
23

Using the useRoute Hook

Code Quiz
24

Handling Focus with useFocusEffect

Code Quiz
25

Customizing Tab Icons and Labels

Code Quiz
26

Passing Params to a Route

Code Quiz
27

Configuring Initial Route

Code Quiz
28

Installing React Navigation Dependencies

Code Quiz
Code QuizIntermediate

Fixing useNavigation Import

Spot the incorrect import that stops the useNavigation hook from working.

Codejavascript
import React from 'react';
import { Button } from 'react-native';
import { useNavigation } from '@react-navigation/stack';

function ProfileButton() {
  const navigation = useNavigation();
  return (
    <Button
      title="Go to Profile"
      onPress={() => navigation.navigate('Profile')}
    />
  );
}

export default ProfileButton;

What is the bug that prevents this component from getting the navigation object?