Подробности: я хочу иметь возможность закрыть диалог после нажатия клавиши Es c, любая помощь будет принята с благодарностью.
Видео, показывающее проблему
Информация о версии:
узел - версия v12.16.1
npm - версия 6.13.4
"реагировать": "^ 16.13 .0 ",
" _ from ":" @ sencha / ext-реакции-modern @ ^ 7.2.0 "
Пожалуйста, дайте мне знать, если вам нужно что-нибудь еще, что может помочь решение этой проблемы.
У меня есть код:
import React, { Component } from 'react';
import { Container, Button } from '@sencha/ext-react-modern';
import { Dialog } from '@sencha/ext-react-modern';
export default class DialogExample extends Component {
state = {
showDialog: false
}
showDialog = () => {
//debugger;
this.setState({ showDialog: true });
}
destroyDialog = () => {
//debugger;
this.setState({ showDialog: false });
}
render() {
const { showDialog } = this.state;
return (
<Container
viewport={true}
layout={{ type: 'vbox', pack: 'center', align: 'middle'}}
>
<Button text="Show Dialog" handler={this.showDialog} ui="action raised" />
{showDialog === true &&
<Dialog1
displayed={showDialog}
destroy={this.destroyDialog}
>
</Dialog1>
}
</Container>
)
}
}
class Dialog1 extends Component {
render() {
return (
<Dialog
displayed={this.props.displayed}
title="Dialog"
closable="true"
width="600"
height="600"
layout={{ type: 'vbox', pack: 'center', align: 'middle'}}
onDestroy={this.props.destroy}
html= 'I want the Dialog to close when Esc key is pressed.'
>
</Dialog>
);
}
}