/** * — o que aparece quando um ecrã rebenta. * * Sem isto, um erro de JavaScript em qualquer componente desmonta a árvore * toda e deixa **uma página em branco**. Quem está do outro lado não tem como * saber se a aplicação morreu, se a internet caiu, ou se carregou no sítio * errado — e não tem como sair dali a não ser recarregando às cegas. * * O React só apanha estes erros através de um componente de classe com * `componentDidCatch`. É a única classe do projecto, e é por isso. * * ## O que mostra, e o que não mostra * * Mostra a mensagem do erro. Não é para o utilizador perceber — é para poder * **dizer-nos** o que apareceu, em vez de "não funciona". Esconder isso só * torna o problema mais difícil de resolver para toda a gente. * * Não mostra a pilha de chamadas: essa vai para a consola, onde quem a sabe * ler a vai buscar. */ class ErroFatal extends React.Component { constructor(props) { super(props); this.state = { erro: null }; } static getDerivedStateFromError(erro) { return { erro }; } componentDidCatch(erro, info) { // A consola é onde isto fica até haver registo de erros do lado do servidor. console.error('[NetScreen] ecrã rebentou:', erro, info?.componentStack); } render() { if (!this.state.erro) return this.props.children; return (
); } }