在 React 中定义一个按钮 ( "Cancel" ) 来关闭整个反应应用程序而不是窗口？

Question

我试图在React中定义一个按钮("Cancel")来关闭整个React应用程序，但不是窗口?

} className = {buttonClassses window.close()。Join (' ')} size="large"变量="contained"颜色="secondary"比;{道具。取消}

我应该怎么做而不是onClick={() =>window.close ()} ?

Answer 1

这将关闭浏览器的选项卡，但不会关闭整个浏览器

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

希望有帮助

Answer 2

嗯，是的，你可以调用这个条件渲染，在这个条件渲染中，你需要在句柄状态下这样做。

在我的代码中，你可以按esc

按钮，我在上面处理一个状态，在App.js中，它将在条件基 上呈现UI。请检查下面的代码和演示点击这里

运行demo后点击ESC按钮，用于切换UI

我们知道我们的react应用程序是从index.js或app.js开始的，所以我们可以关闭app.js中的所有组件，而不是渲染一些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>
</>
);
}
}
}