Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

238
Vistas
define a button ("Cancel") in React to close the whole react-app but not the Window?

i am trying to define a button ("Cancel") in React to close the whole react-app but not the Window?

<Button onClick={() => window.close()} className={buttonClassses.join(' ')} size="large" variant="contained" color="secondary"> {props.cancel}

What should i do instead of onClick={() => window.close()}?

about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

This will close the tab of the browser but not the whole browser

window.open("about:blank", "_self"); window.close();

Hope it helps

about 4 years ago · Juan Pablo Isaza Denunciar

0

Well yes its possible you can call this conditional rendering in which you need to do this on handle state.

in my code you can press esc button on which im handling a state which in App.js will render UI on the conditional base

please check the below code and for demo click here

After run demo click ESC button which toggle both UI

we know our react app start from index.js or app.js so we can close all the component in App.js and instead of that we can render some UI.

import React, { Component } from 'react';

export default class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      closeMyApp: true,
    };
  }

  escFunction = (event) => {
    if (event.keyCode === 27) {
      this.setState({ closeMyApp: !this.state.closeMyApp });
    }
  };

  componentDidMount() {
    document.addEventListener('keydown', this.escFunction, false);
  }
  componentWillUnmount() {
    document.removeEventListener('keydown', this.escFunction, false);
  }

  render() {
    if (this.state.closeMyApp) {
      return (
        <div>
          <h1>All App Componenet in this section</h1>
          <p>App is runing!</p>
        </div>
      );
    } else {
      return (
        <>
          <h1>App is closed</h1>
          <h3>You can set some UI here like</h3>
        </>
      );
    }
  }
}
about 4 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 Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda