Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

239
Visualizações
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 Respostas
Responde à pergunta

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 Relatório

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 Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda