React native 如何在React本机页面（包括Webview）中使用导航goback功能

我在React native中使用Webview

页眉和页脚不是webview，页眉中包含navigation.goBack（）按钮

但即使页脚上有navigation.navigate（）按钮也无法工作。 这是我的密码

import 'react-native-gesture-handler';
import * as React from "react";
import { ImageBackground, StyleSheet, Text, View, Image, TextInput, TouchableOpacity } from "react-native";
import { AntDesign } from '@expo/vector-icons';
import { WebView } from 'react-native-webview';
import { height, width } from 'react-native-dimension';
import HeaderLink from './header_link';
import Footer from './footer';

const styles = StyleSheet.create({
    container: {
      flex: 1, 
      // flexDirection: "column"
    },
});

class LinkPageScreen extends React.Component {
    render() {
        this.state = {
            url: this.props.route.params.url,
            title: this.props.route.params.title,
        };
        var linkURL = this.state.url;
        
        return (
            <View style={styles.container}>
                <HeaderLink
                    image={false}
                    imageSource={{}}
                    left={
                    <TouchableOpacity onPress={ () => this.props.navigation.goBack(null) }>
                      ....
                    </TouchableOpacity>
                    }
                 
                />
                <WebView
                    source={{uri: linkURL}}
                    style={{marginTop: height(12), marginBottom: height(11)}}
                />
                <Footer navigation={this.props.navigation} />
            </View>
            
        )
    }
}

export default LinkPageScreen

导入“反应本机手势处理程序”；
从“React”导入*作为React；
从“react native”导入{ImageBackground，StyleSheet，Text，View，Image，TextInput，TouchableOpacity}；
从“@expo/vector icons”导入{AntDesign}；
从“react native WebView”导入{WebView}；
从“反应本机维度”导入{height，width}；
从“./header_link”导入HeaderLink；
从“./Footer”导入页脚；
const styles=StyleSheet.create({
容器：{
弹性：1，
//flexDirection：“列”
},
});
类LinkPageScreen扩展了React.Component{
render（）{
此.state={
url:this.props.route.params.url，
标题：this.props.route.params.title，
};
var linkURL=this.state.url；
返回(
....
}
/>
)
}
}
导出默认链接页面屏幕

我将navigation.goBack更改为navigation.navigate（），但它在标题中也不起作用。

---

我在stackoverflow上检查了相同的错误，但webview.goback（）函数存在，我的问题不是这样的。我确信。

您可以尝试以下代码：

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

const {goBack} = useNavigation();

const navigateBack = useCallback(() => {
    goBack();
}, [goBack]);
.
.
.

<TouchableOpacity onPress={navigateBack}>
 ....
</TouchableOpacity>

从'@react-navigation/native'导入{useNavigation}；
const{goBack}=useNavigation（）；
const navigateBack=useCallback（（）=>{
goBack（）；
}，[goBack]）；
.
.
.
....

我找到了解决方案。连我都不知道为什么。 我改变了代码如下

class LinkPageScreen extend React.component {
   render() {
     return (
        <View>
           <WebView .... />
           <Header />
           <Footer />
      ......

class LinkPageScreen extend React.component{
render（）{
返回(
......

我只是改变了webview和header之间标记的顺序，这是不可能实现的。 有人能向我解释为什么会发生这种事吗？ 谢谢