Gestire gli errori in Reactjs può essere fatto in vari modi. Ecco alcuni di questi:
1. Catch JavaScript Errors with Error Boundary: React 16 ha introdotto un nuovo concetto di “error boundaries”. Le Error Boundaries sono componenti React che catturano errori JavaScript in tutto l’albero delle loro sottocomponenti, registrano tali errori e visualizzano una interfaccia di fallback invece dell’albero di componenti che si è rotto. Un class component diventa un error boundary se definisce uno o entrambi i metodi di lifecycle `getDerivedStateFromError()` o `componentDidCatch()`.
```
class ErrorBoundary extends React.Component {
constructor(props) {
super(props);
this.state = { hasError: false };
}
1. Try and catch: Il blocco try / catch ti permette di testare un blocco di codice per vedere se ci sono errori.
```
try {
//codice a rischio di errori
}
catch(err) {
//gestione degli errori
}
```
1. Gestione delle promesse: Ogni volta che si lavora con operazioni asincrone come richieste http o lettura / scrittura di file, è possibile utilizzare la catena di promesse .catch() per gestire e catturare l’errore. Anche l’async / await può essere usato con il blocco try / catch per la gestione degli errori.
```
fetch(url)
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));
```
1. PropTypes: un’altra bella caratteristica di React è PropTypes che ti permette di controllare i tipi di props passati ai componenti. Ciò può aiutare a prevenire errori.
```
import PropTypes from ‘prop-types’;
MyComponent.propTypes = {
name: PropTypes.string,
age: PropTypes.number.isRequired
};
```
1. Test: Avere un solido insieme di test unitari e end-to-end può aiutare a prevenire molti errori di codice. Jest e React Testing Library sono strumenti di test commonly usati con React.