如何在堆栈导航中为 Webview 制作后退按钮

问题描述

如何在 Web 视图的堆栈导航器中制作后退按钮?请帮忙!我继续尝试,但我只是遇到错误。如果您能给我提供一个带有后退箭头图标的代码。我删除了它,但实际上我有五个不同的页面。他们都有一个底部导航栏,一个堆栈导航栏,并且使用的是 webview。如何在堆栈导航器中制作后退按钮?请帮忙!谢谢!

// pages
function HomeScreen({ navigation }) {
      
        return (
          <WebView
            source={{
              uri: 'https://www.stoodnt.com/'
            }}
            style={{ marginTop: -120 }}
          />
        );
         
}

// Stack Navigation
const HomeStack = createStackNavigator();
function HomeStackScreen() {
 return (
   <HomeStack.Navigator>
    <HomeStack.Screen name="Home" component={HomeScreen} />
   </HomeStack.Navigator>
  );
}


// Bottom Navigation
const Tab = createBottomTabNavigator();

export default function App() {

    return (
       <NavigationContainer>
         <Tab.Navigator
           screenOptions={({ route }) => ({
             tabBarIcon: ({ focused,color,size }) => {
               let iconName;

            if (route.name === 'Home') {
              iconName = focused
                ? 'ios-home'
                : 'ios-home';
            } 
   
            return <Ionicons name={iconName} size={40} color={'orange'} />;

          },})}
            tabBarOptions={{
              activeTintColor: '#000000',inactiveTintColor: '#616161',labelStyle: {
                fontSize: 11,},style: {
                backgroundColor: '#F7F7F7',}}

      >

          <Tab.Screen name="Home" component={HomeStackScreen} />

        </Tab.Navigator>
    </NavigationContainer>  

  );

}

const styles = StyleSheet.create({
  container: {
    flex: 1,backgroundColor: '#fff',alignItems: 'center',justifyContent: 'center',});

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)