Как использовать Drawer Navigation и Stack Navigator в сочетании с React-native? ⇐ Android

[Anonymous]

Использованные пакеты:

• "@react-navigation/drawer": "^6.1.8",
  "@react-navigation/native": "^6.0.6",
• "@react-navigation/stack": "^6.0.11" ,

Проблема:
Изображение 1, 2 и 3: Я реализовал ящик, в котором показаны два варианта: «Домашняя страница» и «Правила и условия». Если вы нажмете на опцию t&c, откроется его экран, и то же самое, если вы нажмете на главный экран, он вернется на экран главной страницы.
Изображения 1 и 4: Я сделал Текст «Нажмите, чтобы просмотреть страницу подробностей» доступен для клика на главном экране, и после того, как я нажимаю, он должен перейти на экран подробностей, но выдает ошибку в виде изображения 4. Я не понимаю, как это реализовать. Где мне написать код Stack.Navigation.

App.js

Код: Выделить всё

import * as React from 'react';
import { Button, View } from 'react-native';
import { createDrawerNavigator } from '@react-navigation/drawer';
import { NavigationContainer } from '@react-navigation/native';
import HomeScreen from './Screens/HomeScreen';
import DetailPage from './Screens/DetailPage';
import TermsCondition from './Screens/TermsCondition';

const Drawer = createDrawerNavigator();

export default function App() {
return (






);
}

HomeScreen.js

Код: Выделить всё

export default function HomeScreen({ navigation }) {
return (
 navigation.navigate('DetailPage')}>

Click for Details Page


);
}

TermsCondition.js

Код: Выделить всё

function TermsCondition({ navigation}) {
return (

T&C Page

);
}
export default TermsCondition;

DetailPage.js

Код: Выделить всё

function DetailPage({ navigation}) {
return (

DetailPage

);
}

экспортировать страницу DetailPage по умолчанию;
Извините за этот глупый вопрос, но я попробовал это в Интернете, но сильно запутался.
Заранее спасибо!

Подробнее здесь: https://stackoverflow.com/questions/699 ... act-native