• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

210
Vistas
Restringir la aplicación para que no regrese a través de react-native-webview (React Native)

Desarrollé un sitio web usando reaccionar y ahora he estado tratando de usar esto a través de webview en reaccionar nativo.

Problema: cuando uso el botón Atrás, la aplicación se cierra.

Razón:

  • En mi sitio web de React, estoy usando Link {from react-router dom} para que la navegación no se agregue en el historial.
  • En React Native, dado que onNavigationStateChange usa el historial, navState.canGoBack() devuelve falso.

¿Qué puedo incluir en este else block in handleBackButton para que la aplicación no se cierre?

 import React, { Component } from "react"; import { SafeAreaView, Platform, StatusBar } from "react-native"; import { BackHandler } from "react-native"; import { WebView } from "react-native-webview"; export default class Marketplace extends Component { constructor(props) { super(props); this.state = { canGoBack: false, } } WEBVIEW_REF = React.createRef(); componentDidMount() { BackHandler.addEventListener("hardwareBackPress", this.handleBackButton); } componentWillUnmount() { BackHandler.removeEventListener("hardwareBackPress", this.handleBackButton); } handleBackButton = () => { if (this.state.canGoBack) { this.WEBVIEW_REF.current.goBack(); return true; } else { console.log("Else block"); // what to add here to restrict the app to exit } }; onNavigationStateChange = (navState) => { console.log("navState", navState.canGoBack); this.setState({ canGoBack: navState.canGoBack, }); }; render() { return ( <SafeAreaView style={{ flex: 1, paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0, }} > <WebView source={{ uri: "http://localhost:3000/", }} ref={this.WEBVIEW_REF} onNavigationStateChange={this.onNavigationStateChange} /> </SafeAreaView> ); } }
almost 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

si desea impedir que el usuario salga de la aplicación, también tendrá que devolver verdadero en la declaración else o simplemente puede hacer esto:

 handleBackButton = () => { if (this.state.canGoBack) { this.WEBVIEW_REF.current.goBack(); } return true; }
almost 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda