如何处理 AppStack 4.0 版（ headerLeft ）中的后退按钮功能？

Question

• 在页面中应用 js
• 反应：钩子 导航：第 4 版
• backLeft 错误 ReferenceError：找不到变量：导航
• 我想回到上一个屏幕，但是 back() 函数不起作用。
• 导航和返回功能无法识别。

import Info from "./Screens/Info";
import Note from "./Screens/Note";
import { createAppContainer } from "react-navigation";
import { createStackNavigator } from "react-navigation-stack";
function App() {
  return (
    <SafeAreaView style={styles.container}>
      <StatusBar barStyle="dark" />
      <AppContainer />
      <View>
      </View>
    </SafeAreaView>
  );
}

const AppStack = createStackNavigator(
  {
    Start: {
      screen: Start,
      navigationOptions: {
        title: '',
      },
      params: { user: 'me' },
    },

    Info: {
      screen: Info,
      navigationOptions: { title: 'الصفحة الرئيسية' },
    },
    Guide: {
      screen: Guide,
      navigationOptions: { title: 'دليل الصيانة' },
    },
    Note: {
      screen: Note,
      navigationOptions: {
        title: 'المذكرة',
// **the error is here ⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇⬇❌❌❌❌❌❌**
        headerLeft: () => <TouchableOpacity onPress={() => { goBack() }} ><Text style={{ color: '#fff' }}>back</Text></TouchableOpacity>
      },
    },

  },
  {
    initialRouteName: "Start",
  
  
   
    },

  }
);

export default createAppContainer(AppStack);

Answer 1

试试这个：

Note: {
  screen: Note,
  navigationOptions: ({ navigation }) => ({
    title: 'المذكرة',
    headerLeft: () => <TouchableOpacity onPress={() => { navigation.goBack() }} ><Text style={{ color: '#fff' }}>back</Text></TouchableOpacity>
  }),
},

您可以像上面一样访问navigationOptions中的navigation对象，然后它将用于导航路线。